bare-ui-kit 0.2.0 → 0.3.0

package/lib/view.js

@@ -1,29 +1,298 @@
 const EventEmitter = require('bare-events')
 const binding = require('../binding')
+const registry = require('bare-foundation-registry')
+const { adopt } = require('./handle')
+const scratch = require('./scratch')
+const observe = require('./events')
+const wrap = require('./wrap')
+const UIKitColor = require('./color')
 
-module.exports = class UIKitView extends EventEmitter {
-  constructor(handle = null) {
+const EVENTS = {
+  [binding.VIEW_EVENT_TOUCHES_BEGAN]: 'touchesBegan',
+  [binding.VIEW_EVENT_TOUCHES_MOVED]: 'touchesMoved',
+  [binding.VIEW_EVENT_TOUCHES_ENDED]: 'touchesEnded',
+  [binding.VIEW_EVENT_TOUCHES_CANCELLED]: 'touchesCancelled'
+}
+
+// The wrapper the superview already has. None is made, because it would be
+// garbage straight away.
+function holder(tag) {
+  const superview = binding.viewSuperview(tag)
+
+  if (superview === null) return null
+
+  return binding.wrapper(superview) || null
+}
+
+module.exports = exports = class UIKitView extends EventEmitter {
+  constructor(opts = {}) {
     super()
 
-    this._handle = handle
+    const { tag = null } = opts
+
+    this._tag = tag === null ? this._init(opts) : tag
+    this._retained = new Set()
+
+    this._token = binding.claim(this._tag, this)
+
+    observe(this)
+  }
+
+  get [registry.tag]() {
+    return this._tag
+  }
+
+  get [registry.handle]() {
+    return binding.handle(this._tag)
+  }
+
+  _init(opts) {
+    const { x = 0, y = 0, width = 0, height = 0 } = opts
+
+    return binding.viewInit(x, y, width, height, this)
+  }
+
+  get frame() {
+    binding.viewFrameInto(this._tag, scratch.buffer, 0)
+
+    return { x: scratch[0], y: scratch[1], width: scratch[2], height: scratch[3] }
+  }
+
+  set frame(frame) {
+    const { x = 0, y = 0, width = 0, height = 0 } = frame
+
+    binding.viewFrame(this._tag, x, y, width, height)
+  }
+
+  get bounds() {
+    binding.viewBoundsInto(this._tag, scratch.buffer, 0)
+
+    return { x: scratch[0], y: scratch[1], width: scratch[2], height: scratch[3] }
+  }
+
+  set bounds(bounds) {
+    const { x = 0, y = 0, width = 0, height = 0 } = bounds
+
+    binding.viewBounds(this._tag, x, y, width, height)
   }
 
   get hidden() {
-    return binding.viewHidden(this._handle)
+    return binding.viewHidden(this._tag)
+  }
+
+  set hidden(hidden) {
+    binding.viewHidden(this._tag, hidden)
+  }
+
+  get alpha() {
+    return binding.viewAlpha(this._tag)
+  }
+
+  set alpha(alpha) {
+    binding.viewAlpha(this._tag, alpha)
+  }
+
+  get contentMode() {
+    return binding.viewContentMode(this._tag)
+  }
+
+  set contentMode(contentMode) {
+    binding.viewContentMode(this._tag, contentMode)
+  }
+
+  get clipsToBounds() {
+    return binding.viewClipsToBounds(this._tag)
+  }
+
+  set clipsToBounds(clipsToBounds) {
+    binding.viewClipsToBounds(this._tag, clipsToBounds)
+  }
+
+  get userInteractionEnabled() {
+    return binding.viewUserInteractionEnabled(this._tag)
+  }
+
+  set userInteractionEnabled(userInteractionEnabled) {
+    binding.viewUserInteractionEnabled(this._tag, userInteractionEnabled)
+  }
+
+  get backgroundColor() {
+    return wrap(UIKitColor, binding.viewBackgroundColor(this._tag))
+  }
+
+  set backgroundColor(backgroundColor) {
+    binding.viewBackgroundColor(this._tag, adopt(backgroundColor))
+  }
+
+  get tintColor() {
+    return wrap(UIKitColor, binding.viewTintColor(this._tag))
+  }
+
+  set tintColor(tintColor) {
+    binding.viewTintColor(this._tag, adopt(tintColor))
+  }
+
+  get safeAreaInsets() {
+    binding.viewSafeAreaInsetsInto(this._tag, scratch.buffer, 0)
+
+    return { top: scratch[0], left: scratch[1], bottom: scratch[2], right: scratch[3] }
+  }
+
+  get superview() {
+    return wrap(UIKitView, binding.viewSuperview(this._tag))
+  }
+
+  get subviews() {
+    return binding.viewSubviews(this._tag).map((tag) => wrap(UIKitView, tag))
   }
 
-  set hidden(value) {
-    binding.viewHidden(this._handle, value)
+  // Holding the wrapper keeps its listeners alive. Only one of our views should
+  // hold it, so the previous superview lets go. UIKit detaches the native view
+  // itself.
+  _attach(view) {
+    const tag = adopt(view)
+    const superview = holder(tag)
+
+    if (superview !== null) superview._retained.delete(view)
+
+    this._retained.add(view)
+
+    return tag
   }
 
   addSubview(view) {
-    binding.viewAddSubview(this._handle, view._handle)
+    binding.viewAddSubview(this._tag, this._attach(view))
+    return this
+  }
+
+  insertSubviewAtIndex(view, index) {
+    binding.viewInsertSubviewAtIndex(this._tag, this._attach(view), index)
+    return this
+  }
+
+  insertSubviewBelowSubview(view, sibling) {
+    binding.viewInsertSubviewBelowSubview(this._tag, this._attach(view), adopt(sibling))
+    return this
+  }
+
+  insertSubviewAboveSubview(view, sibling) {
+    binding.viewInsertSubviewAboveSubview(this._tag, this._attach(view), adopt(sibling))
     return this
   }
 
+  removeFromSuperview() {
+    const superview = holder(this._tag)
+
+    if (superview !== null) superview._retained.delete(this)
+
+    binding.viewRemoveFromSuperview(this._tag)
+
+    return this
+  }
+
+  setNeedsLayout() {
+    binding.viewSetNeedsLayout(this._tag)
+    return this
+  }
+
+  setNeedsDisplay() {
+    binding.viewSetNeedsDisplay(this._tag)
+    return this
+  }
+
+  endEditing(force = true) {
+    return binding.viewEndEditing(this._tag, force)
+  }
+
+  convertPointToView(x, y, view = null) {
+    return binding.viewConvertPointToView(this._tag, x, y, view === null ? null : view._tag)
+  }
+
+  convertPointFromView(x, y, view = null) {
+    return binding.viewConvertPointFromView(this._tag, x, y, view === null ? null : view._tag)
+  }
+
+  sizeThatFits(width, height) {
+    binding.viewSizeThatFitsInto(this._tag, width, height, scratch.buffer, 0)
+
+    return { width: scratch[0], height: scratch[1] }
+  }
+
+  becomeFirstResponder() {
+    return binding.viewBecomeFirstResponder(this._tag)
+  }
+
+  resignFirstResponder() {
+    return binding.viewResignFirstResponder(this._tag)
+  }
+
+  get firstResponder() {
+    return binding.viewIsFirstResponder(this._tag)
+  }
+
+  sizeToFit() {
+    binding.viewSizeToFit(this._tag)
+    return this
+  }
+
+  get overrideUserInterfaceStyle() {
+    return binding.viewOverrideUserInterfaceStyle(this._tag)
+  }
+
+  set overrideUserInterfaceStyle(style) {
+    binding.viewOverrideUserInterfaceStyle(this._tag, style)
+  }
+
+  get userInterfaceStyle() {
+    return binding.viewUserInterfaceStyle(this._tag)
+  }
+
+  _ontraitchange() {
+    this.emit('traitChange')
+  }
+
+  // UIKit reports touches together, and the binding sends them one at a time.
+  _onevent(type, x, y, pointerId) {
+    const name = EVENTS[type]
+
+    if (name === undefined) return
+
+    this.emit(name, { x, y, pointerId })
+  }
+
   [Symbol.for('bare.inspect')]() {
     return {
       __proto__: { constructor: UIKitView }
     }
   }
 }
+
+// The same bits as the map above, by event name.
+exports._events = {}
+
+for (const bit in EVENTS) exports._events[EVENTS[bit]] = Number(bit)
+
+// A trait change has a callback of its own, so its bit is added separately.
+exports._events.traitChange = binding.VIEW_EVENT_TRAIT_CHANGE
+
+exports.USER_INTERFACE_STYLE = {
+  UNSPECIFIED: binding.USER_INTERFACE_STYLE_UNSPECIFIED,
+  LIGHT: binding.USER_INTERFACE_STYLE_LIGHT,
+  DARK: binding.USER_INTERFACE_STYLE_DARK
+}
+
+exports.CONTENT_MODE = {
+  SCALE_TO_FILL: binding.VIEW_CONTENT_MODE_SCALE_TO_FILL,
+  SCALE_ASPECT_FIT: binding.VIEW_CONTENT_MODE_SCALE_ASPECT_FIT,
+  SCALE_ASPECT_FILL: binding.VIEW_CONTENT_MODE_SCALE_ASPECT_FILL,
+  REDRAW: binding.VIEW_CONTENT_MODE_REDRAW,
+  CENTER: binding.VIEW_CONTENT_MODE_CENTER,
+  TOP: binding.VIEW_CONTENT_MODE_TOP,
+  BOTTOM: binding.VIEW_CONTENT_MODE_BOTTOM,
+  LEFT: binding.VIEW_CONTENT_MODE_LEFT,
+  RIGHT: binding.VIEW_CONTENT_MODE_RIGHT,
+  TOP_LEFT: binding.VIEW_CONTENT_MODE_TOP_LEFT,
+  TOP_RIGHT: binding.VIEW_CONTENT_MODE_TOP_RIGHT,
+  BOTTOM_LEFT: binding.VIEW_CONTENT_MODE_BOTTOM_LEFT,
+  BOTTOM_RIGHT: binding.VIEW_CONTENT_MODE_BOTTOM_RIGHT
+}

package/lib/window.d.ts

@@ -0,0 +1,44 @@
+import { tag, handle, Handle, Wrapper } from 'bare-foundation-registry'
+import UIKitView = require('./view')
+import UIKitScene = require('./scene')
+import UIKitViewController = require('./view-controller')
+
+/** A window, as a `UIWindow`. */
+interface UIKitWindow extends UIKitView<UIKitWindow.Events> {
+  get rootViewController(): UIKitViewController | null
+  set rootViewController(viewController: Wrapper | null)
+
+  get windowScene(): UIKitScene | null
+  set windowScene(scene: Wrapper | null)
+
+  /** Whether the window gets keyboard input. */
+  readonly keyWindow: boolean
+
+  makeKeyWindow(): this
+
+  /** Show the window and make it get keyboard input. The window is kept alive from then on. */
+  makeKeyAndVisible(): this
+}
+
+declare class UIKitWindow {
+  /**
+   * Create a window in `scene`. Without a frame, the window fills its scene. Give any frame field
+   * to set the frame, and the missing ones are 0. A window without a scene is never shown.
+   */
+  constructor(opts?: {
+    scene?: Wrapper | null
+    x?: number
+    y?: number
+    width?: number
+    height?: number
+  })
+}
+
+declare namespace UIKitWindow {
+  export interface Events {
+    /** The keyboard is about to move to this frame, in screen coordinates. */
+    keyboardWillChangeFrame: [frame: { x: number; y: number; width: number; height: number }]
+  }
+}
+
+export = UIKitWindow

package/lib/window.h

@@ -6,10 +6,19 @@
 
 #import "bridging.h"
 
-@interface BareWindow : UIWindow {
+// The keyboard is reported as a notification, carrying where it will be when it
+// stops moving. A window is what that frame is measured against, so a window
+// observes it while the mask asks.
+enum {
+  bare_ui_kit_window_event_keyboard_will_change_frame = 1 << 0,
+};
+
+@interface BareWindow : UIWindow <BareEventTarget> {
 @public
   js_env_t *env;
   js_ref_t *ctx;
+
+  int32_t mask;
 }
 
 @end
@@ -19,37 +28,95 @@
 - (void)dealloc {
   int err;
 
+  [NSNotificationCenter.defaultCenter removeObserver:self];
+
   err = js_delete_reference(env, ctx);
   assert(err == 0);
 
   [super dealloc];
 }
 
+- (int32_t)eventMask {
+  return mask;
+}
+
+- (void)setEventMask:(int32_t)value {
+  int32_t changed = mask ^ value;
+
+  mask = value;
+
+  if ((changed & bare_ui_kit_window_event_keyboard_will_change_frame) == 0) return;
+
+  if ((value & bare_ui_kit_window_event_keyboard_will_change_frame) != 0) {
+    [NSNotificationCenter.defaultCenter
+      addObserver:self
+         selector:@selector(bareKeyboardWillChangeFrame:)
+             name:UIKeyboardWillChangeFrameNotification
+           object:nil];
+  } else {
+    [NSNotificationCenter.defaultCenter
+      removeObserver:self
+                name:UIKeyboardWillChangeFrameNotification
+              object:nil];
+  }
+}
+
+- (void)bareKeyboardWillChangeFrame:(NSNotification *)notification {
+  NSValue *frame = notification.userInfo[UIKeyboardFrameEndUserInfoKey];
+
+  if (frame == nil) return;
+
+  // In screen coordinates, as the notification reports it.
+  bare_ui_kit__emit_rect(env, ctx, "_onkeyboardwillchangeframe", [frame CGRectValue]);
+}
+
 @end
 
+// A window without a scene is never shown.
 static js_value_t *
 bare_ui_kit_window_init(js_env_t *env, js_callback_info_t *info) {
   int err;
 
-  size_t argc = 1;
-  js_value_t *argv[1];
+  size_t argc = 6;
+  js_value_t *argv[6];
 
-  err = js_get_callback_info(env, info, &argc, argv, NULL, NULL);
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
   assert(err == 0);
 
-  assert(argc == 1);
+  assert(argc == 6);
+
+  js_value_type_t type;
+  err = js_typeof(env, argv[1], &type);
+  assert(err == 0);
+
+  bool framed = type != js_null;
+
+  double x = 0, y = 0, width = 0, height = 0;
+
+  if (framed) {
+    if (!bare_ui_kit__read_double(env, argv[1], "x", &x)) return NULL;
+    if (!bare_ui_kit__read_double(env, argv[2], "y", &y)) return NULL;
+    if (!bare_ui_kit__read_double(env, argv[3], "width", &width)) return NULL;
+    if (!bare_ui_kit__read_double(env, argv[4], "height", &height)) return NULL;
+  }
 
   js_value_t *result;
 
   @autoreleasepool {
-    BareWindow *handle = [[BareWindow alloc] init];
+    UIWindowScene *scene = bare_foundation_to_object(env, state->registry, argv[0]);
 
-    err = js_create_external(env, (void *) CFBridgingRetain(handle), bare_ui_kit__on_bridged_release, NULL, &result);
-    assert(err == 0);
+    BareWindow *handle = scene
+                           ? [[[BareWindow alloc] initWithWindowScene:scene] autorelease]
+                           : [[[BareWindow alloc] initWithFrame:CGRectZero] autorelease];
+
+    if (framed) handle.frame = CGRectMake(x, y, width, height);
+
+    result = bare_foundation_bridge(env, state->registry, handle);
 
     handle->env = env;
 
-    err = js_create_reference(env, argv[0], 1, &handle->ctx);
+    err = js_create_reference(env, argv[5], 0, &handle->ctx);
     assert(err == 0);
   }
 
@@ -57,20 +124,20 @@ bare_ui_kit_window_init(js_env_t *env, js_callback_info_t *info) {
 }
 
 static js_value_t *
-bare_ui_kit_window_root_view_controller(js_env_t *env, js_callback_info_t *info) {
+bare_ui_kit_window_window_scene(js_env_t *env, js_callback_info_t *info) {
   int err;
 
   size_t argc = 2;
   js_value_t *argv[2];
 
-  err = js_get_callback_info(env, info, &argc, argv, NULL, NULL);
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
   assert(err == 0);
 
   assert(argc == 1 || argc == 2);
 
   void *handle;
-  err = js_get_value_external(env, argv[0], &handle);
-  assert(err == 0);
+  if (bare_foundation_read_tag(env, state->registry, argv[0], "handle", &handle) < 0) return NULL;
 
   js_value_t *result = NULL;
 
@@ -78,20 +145,40 @@ bare_ui_kit_window_root_view_controller(js_env_t *env, js_callback_info_t *info)
     UIWindow *window = (__bridge UIWindow *) handle;
 
     if (argc == 1) {
-      UIViewController *view_controller = window.rootViewController;
+      result = bare_foundation_bridge(env, state->registry, window.windowScene);
+    } else {
+      window.windowScene = bare_foundation_to_object(env, state->registry, argv[1]);
+    }
+  }
 
-      if (view_controller == NULL) return NULL;
+  return result;
+}
 
-      err = js_create_external(env, (void *) CFBridgingRetain(handle), bare_ui_kit__on_bridged_release, NULL, &result);
-      assert(err == 0);
-    } else {
-      void *handle;
-      err = js_get_value_external(env, argv[1], &handle);
-      assert(err == 0);
+static js_value_t *
+bare_ui_kit_window_root_view_controller(js_env_t *env, js_callback_info_t *info) {
+  int err;
 
-      UIViewController *view_controller = (__bridge UIViewController *) handle;
+  size_t argc = 2;
+  js_value_t *argv[2];
+
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
+  assert(err == 0);
+
+  assert(argc == 1 || argc == 2);
 
-      window.rootViewController = view_controller;
+  void *handle;
+  if (bare_foundation_read_tag(env, state->registry, argv[0], "handle", &handle) < 0) return NULL;
+
+  js_value_t *result = NULL;
+
+  @autoreleasepool {
+    UIWindow *window = (__bridge UIWindow *) handle;
+
+    if (argc == 1) {
+      result = bare_foundation_bridge(env, state->registry, window.rootViewController);
+    } else {
+      window.rootViewController = bare_foundation_to_object(env, state->registry, argv[1]);
     }
   }
 
@@ -105,20 +192,73 @@ bare_ui_kit_window_make_key_window(js_env_t *env, js_callback_info_t *info) {
   size_t argc = 1;
   js_value_t *argv[1];
 
-  err = js_get_callback_info(env, info, &argc, argv, NULL, NULL);
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
   assert(err == 0);
 
   assert(argc == 1);
 
   void *handle;
-  err = js_get_value_external(env, argv[0], &handle);
-  assert(err == 0);
+  if (bare_foundation_read_tag(env, state->registry, argv[0], "handle", &handle) < 0) return NULL;
 
   @autoreleasepool {
-    BareWindow *window = (__bridge BareWindow *) handle;
+    UIWindow *window = (__bridge UIWindow *) handle;
 
     [window makeKeyWindow];
   }
 
   return NULL;
 }
+
+static js_value_t *
+bare_ui_kit_window_make_key_and_visible(js_env_t *env, js_callback_info_t *info) {
+  int err;
+
+  size_t argc = 1;
+  js_value_t *argv[1];
+
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
+  assert(err == 0);
+
+  assert(argc == 1);
+
+  void *handle;
+  if (bare_foundation_read_tag(env, state->registry, argv[0], "handle", &handle) < 0) return NULL;
+
+  @autoreleasepool {
+    UIWindow *window = (__bridge UIWindow *) handle;
+
+    [window makeKeyAndVisible];
+  }
+
+  return NULL;
+}
+
+static js_value_t *
+bare_ui_kit_window_key_window(js_env_t *env, js_callback_info_t *info) {
+  int err;
+
+  size_t argc = 1;
+  js_value_t *argv[1];
+
+  bare_ui_kit_state_t *state;
+  err = js_get_callback_info(env, info, &argc, argv, NULL, (void **) &state);
+  assert(err == 0);
+
+  assert(argc == 1);
+
+  void *handle;
+  if (bare_foundation_read_tag(env, state->registry, argv[0], "handle", &handle) < 0) return NULL;
+
+  js_value_t *result;
+
+  @autoreleasepool {
+    UIWindow *window = (__bridge UIWindow *) handle;
+
+    err = js_get_boolean(env, window.keyWindow, &result);
+    assert(err == 0);
+  }
+
+  return result;
+}