text: $(function(){
    Aj.init(function($scope){
      $scope.data = {
        books: [
          {
            title: "hero",
            authors: ["Michael", "Joe"],
            year : 1980
          },
          {
            title: "escape",
            authors: ["Suzuki", "Liu"],
            year : 1990
          },
        ]
      };
      $scope.snippet(".x-book-info-snippet").bind($scope.data,{
        books: {
          _duplicator: ".x-row",
          _item: {
            _index: "tr.x-row@>[idx=]",
            title: ".x-title",
            authors: {
              _duplicator: ".x-person",
              _item: {
                _value: ":root"
              }
            },// authors
            year: ".x-year"
          }
        },//books,
        currentBook: [
          {
            _selector: "#edit-card",
            _render: function(target, newValue){
              target.prop("book", newValue);
            }
          },
          {
            _selector: "#edit-card-wrapper@>[style:display=]",
            _transform: function(v){
              return v ? "block": "none";
            }
          }
        ]
      }).on("click", "tr.x-row", function(){
        $("tr.x-row").removeClass("current-row");
        var self = $(this);
        var idx = parseInt(self.attr("idx"));
        if($scope.data.currentBook == $scope.data.books[idx]){
          //cancel selection
          $scope.data.currentBook = null;
        }else{
          //switch selection
          $scope.data.currentBook = $scope.data.books[idx];
          self.addClass("current-row");
        }
      });
  
  
    });//end init
  });