Re: [qooxdoo-devel] Controller for ComboBox...

[Peter Schneider]

...'better' attachment (UTF-8 got lost, sorry)

/Peter

-- 


** Unsere Veranstaltungen: 

3. Innovationsforum Telematik in Bocholt, 16.10.2014
BWVL-Tagung in Köln, 12.-13.11.2014

// ---- Model ----
var model = qx.data.marshal.Json.createModel({
  aString  : "txt",
  aBoolean : true,
  aModel   : 30,  // [ 10, 30, 60, ... ]
  a2ndModel: 60,  // [ 10, 30, 60, ... ]
  a3rdModel: 'E'  // [ 'E', 'PI', 'SQRT2', 'LN2' ] Enum
}, true);

// ---- Simple Converter (for a2ndModel) ----
var Converter = {
  toInt : function (str) {
    var matches = str.match(/(\d+|½)(\s+(\S+))?/);
    if (matches) {
      var i = matches[1] == '½' ? 0.5 : matches[1]-0;
      switch (String(matches[3])) {
        case "hour"  : case "hours"  : i *= 60*60; break;
        case "minute": case "minutes": i *= 60; break;
        case "second": case "seconds": break;
        default                      : i *= 60; break; // no postfix=>minutes
      }
      return i;
    }
    return null;
  },
  toStr : function (value) {
    if (!value) { return ""; }
    var postfix = ['second', 'minute', 'hour'], i = 0;
    while (value >= 60) {
      value /= 60; ++i;
    }
    return Math.floor(value) + " " + postfix[i] + (value==1?"":"s");
  }
};

// ---- UI ----
var _row = 0;
var box, grid, label, widget;
var controller = new qx.data.controller.Object(model);

box = new qx.ui.groupbox.GroupBox();
// Grid layout
box.setLayout(new qx.ui.layout.Grid(8, 2).setColumnAlign(0, "right", "middle"));

label = new qx.ui.basic.Label("A string");
widget = new qx.ui.form.TextField().set({liveUpdate: true});
controller.addTarget(widget, "value", "aString", true);
box.add(label, {row: _row, column: 0});
box.add(widget, {row: _row++, column: 1});

label = new qx.ui.basic.Label("A boolean");
widget = new qx.ui.form.CheckBox();
controller.addTarget(widget, "value", "aBoolean", true);
box.add(label, {row: _row, column: 0});
box.add(widget, {row: _row++, column: 1});

label = new qx.ui.basic.Label("A SelectBox");
widget = new qx.ui.form.SelectBox();
widget.add(new qx.ui.form.ListItem("10 seconds", null,   10));
widget.add(new qx.ui.form.ListItem("30 seconds", null,   30));
widget.add(new qx.ui.form.ListItem("1 minute",   null,   60));
widget.add(new qx.ui.form.ListItem("5 minutes",  null,  300));
widget.add(new qx.ui.form.ListItem("10 minutes", null,  600));
widget.add(new qx.ui.form.ListItem("20 minutes", null, 1200));
widget.add(new qx.ui.form.ListItem("½ hour",     null, 1800));
controller.addTarget(widget, "modelSelection[last]", "aModel", true);
box.add(label, {row: _row, column: 0});
box.add(widget, {row: _row++, column: 1});

label = new qx.ui.basic.Label("A ComboBox");
widget = new qx.ui.form.ComboBox();
widget.add(new qx.ui.form.ListItem("10 seconds", null,   10));
widget.add(new qx.ui.form.ListItem("30 seconds", null,   30));
widget.add(new qx.ui.form.ListItem("1 minute",   null,   60));
widget.add(new qx.ui.form.ListItem("5 minutes",  null,  300));
widget.add(new qx.ui.form.ListItem("10 minutes", null,  600));
widget.add(new qx.ui.form.ListItem("20 minutes", null, 1200));
widget.add(new qx.ui.form.ListItem("½ hour",     null, 1800));
controller.addTarget(widget, "value", "a2ndModel", true,
{
  converter: function (data, model, source, target) {
    return Converter.toStr(data);
  }
},{
  converter: function (data, model, source, target) {
    return Converter.toInt(data);
  }
});
box.add(label, {row: _row, column: 0});
box.add(widget, {row: _row++, column: 1});

label = new qx.ui.basic.Label("Another SelectBox");
widget = new qx.ui.form.SelectBox();
widget.add(new qx.ui.form.ListItem(""+Math.LN2,   null, "LN2"  ));
widget.add(new qx.ui.form.ListItem(""+Math.SQRT2, null, "SQRT2"));
widget.add(new qx.ui.form.ListItem(""+Math.E,     null, "E"    ));
widget.add(new qx.ui.form.ListItem(""+Math.PI,    null, "PI"   ));
controller.addTarget(widget, "modelSelection[last]", "a3rdModel", true);
box.add(label, {row: _row, column: 0});
box.add(widget, {row: _row++, column: 1});

widget = new qx.ui.form.TextArea().set({height: 120});
box.add(widget, {row: _row++, column: 0, colSpan:2});

// ---- Model debug output ----
var out = widget;
model.addListener("changeBubble", function (e) {
  var v = [];
  Object.keys(qx.util.Serializer.toNativeObject(model)).forEach(function (key) {
    v.push( "- " + key + ": " + JSON.stringify(model.get(key)) );
  });
  out.setValue( v.join("\n") );
});
model.setAString("Text"); // to trigger "changeBubble"

var doc = this.getRoot();
doc.add(box, {left: 10, top: 10});
------------------------------------------------------------------------------
Slashdot TV.  Videos for Nerds.  Stuff that Matters.
http://pubads.g.doubleclick.net/gampad/clk?id=160591471&iu=/4140/ostg.clktrk
_______________________________________________
qooxdoo-devel mailing list
qooxdoo-devel@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel