var ModelObserver = new Class({
initialize: function(connections) {
    var self = this;
    this.functions = $H({});
    
    this.connections = $H(connections).map(function(conns, key) {
        return conns.map(function(conn) {
            return self._setup_connection(conn, key);
        });
    });
},

observeModel: function(model) {
    var self = this;
    this.model = model;
    this.model.each_property(function(V, K) { self.set(K, V) });
    return this;
},

set: function(key, value) {
    var self = this;
    var conns = this.connections[key];
    var funs = this.functions.get(key);
    console.log(key);
    
    if (this.model)
        this.model.update_property(key, value);
    if (conns)
        conns.each(function(conn) { self._update_connection(conn, value); });
    if ($type(funs) == "array")
        funs.each(function(fun) { fun.call(self.model, value); });
    return this;
},

addCallback: function(key, fun) {
    var funs = this.functions.get(key);
    
    funs = ($type(funs) == "array") ? funs : [];
    funs.push(fun);
    this.functions.set(key, funs);
    return this;
},

_setup_connection: function(conn, key) {
    console.log("Setting up connection to", conn);
    var self = this;
    var el = document.getElement(conn);
    
    if (!el)
        return
    
    switch (el.get("tag")) {
    case "select":
        el.addEvent("change", function(e) {
            self.set(key, this.get("value"));
        });
        break;
        
    case "ul":
        el.addEvent("click", function(e) {
            e.preventDefault();
            // Get the value of the element via its class
            try {
                var value = $(e.target).get("class").
                                     split("option-")[1].
                                     split(" ")[0];
                self.set(key, value);
                console.log('Event fired on swatch');
            } catch(e) {};
        });
        break;
    };
    return el;
},

_update_connection: function(conn, value) {
    if (!conn)
        return;
    
    switch (conn.get("tag")) {
    case "select":
        conn.set("value", value);
        break;
        
    case "ul":
        conn.getElements(".active").removeClass("active");
        try {
            conn.getElement(".option-" + value).getParent().addClass("active");
        } catch(e) {};
        break;
    };
}
});