ko-dict.js

ko = require('knockout');

ko.observableDictionary = function(dict, valueFn) {
  if (!valueFn) {
    valueFn = function() {
      return ko.observable();
    };
  }

  var viewModels = {};
  var viewModelsObs = ko.observable(viewModels);

  var items = ko.computed(function() {
    viewModelsObs();
    return $.map(viewModels, function(value, key) {
      return { key: key, value: value };
    });
  });

  var obs = ko.computed({
    read: function() {
      var dict = {};
      var viewModels = viewModelsObs();
      $.each(viewModels, function(key, viewModel) {
        dict[key] = viewModel();
      });

      return dict;
    },
    write: function(newDict) {
      var garbage = {};
      $.each(dict, function(key) {
        garbage[key] = true;
      });

      var mutated = false;
      $.each(newDict, function(key, newValue) {
        delete garbage[key];
        var viewModel = viewModels[key];
        if (viewModel === undefined) {
          viewModels[key] = viewModel = valueFn(key);
          mutated = true;
        }

        viewModel(newValue);
      });

      $.each(garbage, function(key) {
        delete viewModels[key];
        mutated = true;
      });

      if (mutated) {
        viewModelsObs.valueHasMutated();
      }
    }
  });

  obs.items = items;
  obs(dict);
  return obs;
};