checked.js

define(['can/control', 'can/control/plugin'], function(Control) {

  return can.Control('Checked', {
    init: function(el, opt) {
      var type = this.type = el.attr('type')

      if(type != "checkbox" && type != "radio") {
          console.warn("Cant initialize Checked control on type='" + type + "' element")
          return
      }

      if(opt.obj && !opt.prop) {
        var elName = el.attr('name')

        if(elName) {
          opt.prop = el.attr('name')
          this.on()
        } else {
          console.warn("Cant initialize Value control without option 'prop' or element name attribute")

          return
        }
      }

      console.log("Initializing Value on " + opt.prop)
      this.set()
    },
    "{obj} {prop}": "set",
    "{compute} change": "set",
    set: function() {
      var opt   = this.options,
          el    = this.element,
          val;

      if(opt.obj && opt.prop) {
        val = opt.obj.attr(opt.prop)
      } else if(opt.compute) {
        val = opt.compute()
      }

      if(this.type == "radio") {
        el.prop('checked', el.val() == val)
      } else {
        el.prop('checked', !!val)
      }
    },
    "change": function() {
      var opt     = this.options,
          checked = this.element.prop('checked'),
          set     = true,
          newVal;

      if(this.type == "radio") {
        if(checked) {
          newVal = this.element.val()
        } else {
          set = false
        }
      } else {
        newVal = checked
      }

      if(set) {
        if(opt.obj && opt.prop) {
          opt.obj.attr(opt.prop, newVal)
        } else if(opt.compute) {
          opt.compute(newVal)
        }
      }
    }
  });
})

// Example
var o = new can.Observe({should_be_checked: true})
new Checked($('<input type="checkbox" name="should_be_checked" />'), {obj: o})

value.js

define(['can/control', 'can/control/plugin'], function(Control) {

  return can.Control('Value', {
    init: function(el, opt) {
      if(opt.obj && !opt.prop) {
        var elName = el.attr('name')

        if(elName) {
          opt.prop = el.attr('name')
        } else {
          console.warn("Cant initialize Value control without option 'prop' or element name attribute")

          return
        }
      }

      this.set()
    },
    "{obj} {prop}": "set",
    "{compute} change": "set",
    set: function() {
      var opt = this.options,
          el = this.element;

      if(opt.obj && opt.prop) {
          el.val(opt.obj.attr(opt.prop))
      } else if(opt.compute) {
          el.val(opt.compute())
      }
    },
    "change": function() {
      var opt = this.options,
          val = this.element.val();

      if(opt.obj && opt.prop) {
        opt.obj.attr(opt.prop, val)
      } else if(opt.compute) {
        opt.compute(val)
      }
    }
  });
})

// Example
var o = new can.Observe({some_text: "Hello dear friends"})
new Value($('<input type="text" name="some_text" />'), {obj: o})