var Logger = {
    clear: function() {
        $('#log').val("");
    },
    append: function(text) {
        var dom = $('#log').get(0);
        dom.value+= text + "\n";
        dom.scrollTop = dom.scrollHeight;
    }
};

var Cicindela = {
    base: '/cicindela/',
    set:  'sample',
    _insert_op_url: function(op, item) {
        return this.base +"record?set="+ this.set +"&item_id="+ item + "&op="+ op;
    },
    _send_req: function(url, cb) {
        Logger.append("send Request to " + url);
        $.ajax({ type: "GET",
                 url: url,
                 success: cb,
                 complete: function(xhr, status) {
                     Logger.append("receive Response["+ xhr.status +"] from "+ url);
                 }
               });
    },
    set_category: function(item, category) {
        this._send_req(this._insert_op_url("set_category", item) + "&category_id="+ category);
    },
    insert: function(user, item) {
        this._send_req(this._insert_op_url("insert_pick", item) + "&user_id="+ user);
    }
};

  // $(document).ready において
  $('button#insert').click(
      function(e) {
        var user_id = $('#username').val();
        if(user_id == "") {
          return false;
        }
        $.each(data, function(category_name, category_data) {
                   var category_id = category_data.id;
                   var container = $("#"+ category_name);
                   var values = container.val();
                   $.each(values,
                          function(i, v) {
                              Cicindela.set_category(v, category_id);
                              Cicindela.insert(user_id, v);
                              $('#username').val("");
                          });
               });
        return false;
    });

var Cicindela = {
    /* ...略... */
 
    get_for_item: function(item, category, cb) {
        var url = this.base +'recommend?set='+ this.set
            +'&op=for_item&item_id='+ item +"&category_id="+ category;
        this._send_req(url, cb);
    }
};

  // $(document).ready において
  $('#get').click(
      function(){
          var item_id = $('#items').val();
          $.each(data, function(category_name, category_data) {
                     Cicindela.get_for_item(item_id,
                                            category_data.id,
                                            function(data) {
                                                $("#output-"+ category_name).html(data)
                                            });
                 });
      });

perl create_init_sql.pl --db_name=sample | mysql -uroot

    'sample' => {
        datasource =>  [ 'dbi:mysql:sample;host=localhost', 'cicindela', 'cicindela' ],
        filters => [
            'PicksExtractor',
            'InverseUserFrequency',
            'ItemSimilarities',
        ],
        recommender => 'ItemSimilarities::LimitCategory',
        refresh_interval => 1,
 
        use_user_char_id => 1,
        use_item_char_id => 1,
        discard_user_id_char2int => '6 month',
        },

<h2>追加</h2>
<div class="insert">
<p>username: <input type="text" id="username" /></p>
 
<fieldset><legend>好きな言語</legend>
<select multiple="multiple" id="langs"></select>
</fieldset>
 
<fieldset><legend>よく使うソフト</legend>
<select multiple="multiple" id="softs"></select>
</fieldset>
<p class="submit-space"><button id="insert">insert</button></p>
</div>
 
<h2>取得</h2>
<div class="recommend">
<p><select id="items"></select></p>
 
<fieldset><legend>おすすめ言語</legend>
<div id="output-langs"></div>
</fieldset>
 
<fieldset><legend>おすすめソフト</legend>
<div id="output-softs"></div>
</fieldset>
 
<p class="submit-space"><button id="get">get</button></p>
</div>
 
<h2>ログ</h2>
<textarea id="log"></textarea>

var data = {
    langs: { id: 1,
             list: ['Perl', 'PHP', 'Ruby', 'Python', 'Java',
                    'JavaScript', 'CSharp', 'Erlang', 'CommonLisp'] },
    softs: { id: 2,
             list: ['Windows', 'Linux', 'Mac', 'Emacs', 'Vim',
                    'Eclipse', 'NetBeans', 'VisualStudio', 'Dreamweaver'] }
};

$(function() {
      $.each(data, function(category_name, category_data) {
                 var all_items = $('#items');
                 var category_items = $("#"+ category_name);
                 $.each(category_data.list,
                        function(i,l) {
                            $('<option />').attr('value', l).text(l)
                                .clone().appendTo(category_items)
                                .clone().appendTo(all_items);
                        });
             });
  });

//start月からend月までの選択肢を作る
function updateMonth(start, end) {
  var select  = $('#month');
  var current = select.val();
 
  select.clearOptions();
  for(var i=start; i<=end; ++i) {
      select.addOption(i + "月", i, i == current)
  }
}

var Class = (function() {
        function subclass() {}
        return {
        create: function(parent) {
                function klass() {
                    this.initialize.apply(this, arguments);
                }
 
                var index = 0;
                if(jQuery.isFunction(parent)) {
                    index = 1;
                    subclass.prototype = parent.prototype;
                    klass.prototype = new subclass;
                }
                for(; index < arguments.length; ++index) {
                    jQuery.extend(klass.prototype, arguments[index]);
                }
                return klass;
            }
        }
    })();

var Person = Class.create({
  initialize: function(name) {
    this.name = name;
  },
  say: function(message) {
    return this.name + ': ' + message;
  }
});
 
var Pirate = Class.create(Person, {
  say: function(message) {
    //親クラスのprototypeに直接アクセス
    return Person.prototype.say.call(this, message) + ', yarr!';
  }
});
 
var john = new Pirate('Long John');
john.say('ahoy matey');
// -> "Long John: ahoy matey, yarr!"