sclass HInputField {

  S id = aGlobalID(), name, text;

  bool useWebSocket = true, debug;

  new MapSO params; // for <input> tag

  !include #1028121 // setField + change()

  bool requiresWebSocket() { ret useWebSocket; }

  bool requiresJQuery() { true; }

  S html() {

    new LS out;

    out.add(tag input("", paramsPlus(params,

      type := "text",

      +name,

      value := text,

      +id)));

    if (useWebSocket)

      out.add(hjs_escapedDollarVars([[

        (function() {

          if (typeof wsSend === 'undefined') return;

          var field = $("#" + $id);

          if (field.length == 0) return;

          var lastValue = field.val();

          field.on('change keydown paste input', function() {

            var value = field.val();

            if (lastValue == value) return;

            lastValue = value;

            wsSend(JSON.stringify({inputFieldText: {id: $id, text: value}}));

          });

        })();

      ]], +id));

    ret lines(out);

  }

  void onWebSocketJSON(Map map) {

    Map map2 = optCast Map(map.get("inputFieldText")), ret if null;

    S id = cast map2.get("id");

    if (!eq(id, this.id)) ret;

    S text = cast map2.get("text");

    if (text != null) {

      if (debug) print("Setting HInputField text: " + quote(text));

      setField(+text);

    }

  }

}