//代码1
//console.log(_.functions(Backbone));//["Collection","History","Model","Router","View","noConflict","setDomLibrary","sync","wrapError"]
//console.log(_.functions(Backbone.Events));//["bind","off","on","trigger","unbind"]

//console.log(function(){} == function(){});//false???

/*代码2
var obj = {};
_.extend(obj,Backbone.Events);

obj.on('hack',function(data){
    console.log('I\'m hacked by '+data);
});

obj.trigger('hack','Musikar');//I'm hacked by Musikar
*/

/*代码3
var obj = {
    handler:function(){
        console.log(this === obj);
    }
};
_.extend(obj,Backbone.Events);

obj.on('hacker:start hacker:stop',obj.handler,obj);

obj.trigger('hacker:start','Musikar');//true
obj.trigger('hacker:stop','Musikar');//true
*/

/*代码4
var obj = {};
_.extend(obj,Backbone.Events);

obj.on('all',function(){
    console.log(Math.random());
});

obj.trigger('fuck');
obj.trigger('fuck:me');
*/

/*代码4
var obj = {};
_.extend(obj,Backbone.Events);

obj.on('connection message disconnect',function(){
    console.log('connection');
});

obj.trigger('connection message disconnect');
*/

//console.log(Backbone.Model.toString());
/*

function (attributes, options) {
    var defaults;
    attributes || (attributes = {});
    if (options && options.parse) {
        attributes = this.parse(attributes);
    }
    if ((defaults = getValue(this, "defaults"))) {
        attributes = _.extend({}, defaults, attributes);
    }
    if (options && options.collection) {
        this.collection = options.collection;
    }
    this.attributes = {};
    this._escapedAttributes = {};
    this.cid = _.uniqueId("c");
    this.changed = {};
    this._silent = {};
    this._pending = {};
    this.set(attributes, {silent: true});
    this.changed = {};
    this._silent = {};
    this._pending = {};
    this._previousAttributes = _.clone(this.attributes);
    this.initialize.apply(this, arguments);
}

*/

console.clear();
//console.dir(Backbone.Model.prototype);
/*

_pending
    null

_silent
    null

changed
    null

idAttribute
    "id"

    
constructor
    function()
    
_validate
    function()
    
bind
    function()
    
change
    function()
    
changedAttributes
    function()
    
clear
    function()
    
clone
    function()
    
destroy
    function()
    
escape
    function()
    
fetch
    function()
    
get
    function()
    
has
    function()
    
hasChanged
    function()
    
initialize
    function()
    
isNew
    function()
    
isValid
    function()
    
off
    function()
    
on
    function()
    
parse
    function()
    
previous
    function()
    
previousAttributes
    function()
    
save
    function()
    
set
    function()
    
toJSON
    function()
    
trigger
    function()
    
unbind
    function()
    
unset
    function()
    
url
    function()

*/


/*
var Sidebar = Backbone.Model.extend({
    setColor:function(color){
        this.set({
            color:color
        });
    }
});

window.sidebar = new Sidebar;

sidebar.on('change:color', function(model, color) {
    $('#sidebar').css({background: color});
});

$('#color').keyup(function(){
    
    sidebar.setColor(this.value);
    $('#sidebar').html('<span style="background:#fff;color:'+this.value+';">'+this.value+'</span>');
});



<div id="sidebar" style="height:50px;background:#e8efff;"></div>
<input type="text" name="" id="color" />

*/

/* constructor / initializenew Model([attributes], [options]) 
var demo = Backbone.Model.extend({
    constructor:function(){
        console.log('constructing...');
    },
    initialize:function(){
        console.log('initilizing...');
    },
    property:function(x,y){
        console.log(arguments.callee.length);//2
    }
},{
    classMethod:function(x,y,z){
        console.log(arguments.callee.length);//3
    }
});

console.log(typeof demo.property);//undefined
console.log(typeof (new demo).property);//function
console.log(typeof demo.classMethod);//function

demo.classMethod();//3
(new demo).property();//2
*/

/*

var Demo1 = Backbone.Model.extend({
    hello:function(){
        console.log('hello');
    }
});

var Demo2 = Demo1.extend({
    hello:function(){
        console.log('world');
    }
});

var d1 = new Demo1();
var d2 = new Demo2();

console.log(d1 instanceof Demo1);//true
console.log(d2 instanceof Demo2);//true
console.log(d2 instanceof Demo1);//true

//d2.hello();//world

var Demo2 = Demo1.extend({
    hello:function(){
        Demo1.prototype.hello.call(this);
        console.log('world');
    }
});

var d2 = new Demo2();

d2.hello();//world

*/

/*
var Demo = Backbone.Model.extend({
    constructor:function(){
        console.log('Demo\'s constructor.');
    }
});

var D = Demo.extend({
    constructor:function(){
        console.log(Demo.prototype.constructor.toString());
        console.log('D\'s constructor.');
    }
});

new D;
*/

/*Backbone.Model.get
var Demo = Backbone.Model.extend({
    
});

var d = new Demo({
    name:'PG',
    age:21
},{
    collection:'beauty' 
});

console.log(d.get('name'));//PG
console.log(d.get('age'));//21

*/


/*Backbone.Model.set / Backbone.Model.on
var Demo = Backbone.Model.extend({
    
});

var d = new Demo({
    name:'PG',
    age:21
},{
    collection:'beauty' 
});

d.on('change:name change:age',function(){
    
    console.log(arguments[0] === d);//true
    console.log(arguments[1]);//new data
    console.log(arguments[2]);//changes
    

    console.log(Math.random());
});

d.set('name','Hacker');//用法1 

d.set({
    'name':'Musikar',
    'age':'31'
});//用法2 触发两次change事件

*/

/* Backbone.Model.validate / Backbone.Model.
var Demo = Backbone.Model.extend({
    validate:function(attrs){
        if(attrs.name.length > 2){
            return '不能设置大于2的值';
        }

        if(attrs.age > 30){
            return '年龄太大了';
        }
    }
});

var d = new Demo({
    name:'PG',
    age:21
},{
    collection:'beauty' 
});

d.on('change:name change:age',function(){

    console.log(Math.random());
});


var ret = d.set({
    name:'a',
    age:40
});

console.log('返回值：',ret);//false

var ret = d.set({
    name:'a',
    age:22
});

console.log('返回值：',ret === d);//true 返回Model的引用
*/



/*Backbone.Model.set
var Demo = Backbone.Model.extend({
    validate:function(attrs){
        console.log(attrs);
        if(attrs.age > 30){
            return '年龄太大了';
        }

        if(attrs.name != 'PG'){
            return '你不是PG';
        }
    }
});

var d = new Demo({
    name:'PG',
    age:100
});

d.on('error',function(m,errorMsg,obj){
    console.log(errorMsg);
});

d.set({
    age:31
},{
    silent:true,
    error:function(){
        console.log('不会触发error事件');//不会触发error事件
    }
});

d.set('name','Musikar');//年龄太大了
console.log(d.get('age'));//31
*/


/*Backbone.Model.escape
var hacker = new Backbone.Model({
    name:'<script>alert("xss");</script>'
});

console.log(hacker.get('name'));//<script>alert("xss");</script>
console.log(hacker.escape('name'));//&lt;script&gt;alert(&quot;xss&quot;);&lt;&#x2F;script&gt;
*/


/*Backbone.Model.has
var hacker = new Backbone.Model({
    name:'PG',
    age:30
});

console.log(hacker.has('name'));//true
console.log(hacker.has('gender'));//false
*/

/*Backbone.Model.unset
var hacker = new Backbone.Model({
    name:'PG',
    age:21
});

console.log(hacker.has('name'));//true
hacker.unset('name');
console.log(hacker.has('name'));//false
*/

/*Backbone.Model.clear
var hacker = new Backbone.Model({
    name:'Musikar',
    age:22
});

hacker.on('change',function(){
    //console.log(arguments[0] === hacker);//true
    console.log(arguments[1].changes);//Object { name=true,age=true }
});

hacker.clear({
    //silent:true
});

console.log(hacker.get('name'));//undefined
*/


/*Backbone.Model.id
var hacker = new Backbone.Model({
    name:'Musikar',
    id:'hacker'
});

console.log(hacker.name);//undefined
console.log(hacker.id);//hacker
*/

/*Backbone.Model.idAttribute
var Hacker = Backbone.Model.extend({
    idAttribute:'_id'
});

var hacker = new Hacker({
    '_id':1,
    'name':'Musikar'
});

console.log(hacker.id);//1
*/


/*Backbone.Model.cid
var Hacker = Backbone.Model.extend({
    idAttribute:'_id'
});

var hacker = new Hacker({
    '_id':1,
    'name':'Musikar'
});

var hacker2 = new Hacker({
    '_id':1,
    'name':'Musikar'
});

console.log(hacker.cid,hacker2.cid);//c0,c1
*/


/*Backbone.Model.attributes
var Hacker = Backbone.Model.extend({
    
});

var hacker = new Hacker({
    name:'Musikar',
    age:100
});

console.log(hacker.attributes);//Object { name="Musikar",age=100 }
*/


/*Backbone.Model.changed
var Hacker = Backbone.Model.extend({
    
});

var hacker = new Hacker({
    name:'Musikar',
    age:100
});

hacker.on('change:name',function(){
    console.log(this.changed);//Object { name="Hacker" }
    console.log(hacker.changedAttributes());//Object { name="Hacker" }
});

hacker.set('name','Hacker');
*/


/*Backbone.Model.attributes
var Hacker = Backbone.Model.extend({
    defaults:{
        name:'PG',
        age:21,
        gender:'female'
    }
});

var hacker = new Hacker({
    name:'Musikar'
});
console.log(hacker.attributes);//Object { name="Musikar",age=21,gender="female" }
console.log(hacker.defaults);//Object { name="PG",age=21,gender="female" }
*/

/*Backbone.Model.toJSON
var hacker = new Backbone.Model({
    name:'Musikar',
    age:100
});

console.log(hacker.toJSON());//Object { name="Musikar",age=100 }
*/

/* savemodel.save([attributes], [options])  */
/*
Backbone.sync = function(method,model,options){
    console.log(model.isNew());
    console.log(method + ' : ' +JSON.stringify(model));
    model.id = 1;
};

var Hacker = Backbone.Model.extend({
    validate:function(attrs){
        console.log('validate:',attrs);
        //return '验证失败';
    }
});

var hacker = new Hacker({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log('change:',arguments);
});

hacker.on('sync',function(){
    console.log('sync:',arguments);
});

hacker.save();
console.clear();
//true 
//create : {"name":"PG","age":21}
hacker.save();
//console.clear();
//false
//update : {"name":"PG","age":21}
hacker.save({name:'Musikar'},{
    success:function(){
        console.log('success:',arguments);
    },
    error:function(){
        console.log('error:',arguments);
    }
});
//Object { name="Musikar",age=21 }
//changes
//Object { name=true }
//false
//update : {"name":"PG","age":21}
*/

/*destroy   model.destroy([options]) */
/*
Backbone.sync = function(method,model){
    console.log(method + ' : ' +JSON.stringify(model));
};

var Hacker = Backbone.Model.extend({
    validate:function(attrs){
        console.log('validate:',attrs);
        //return '验证失败';
    }
});

var hacker = new Hacker({
    name:'PG',
    age:21
});

hacker.on('destroy',function(){
    console.log('destroy:',arguments);
});

hacker.on('sync',function(){
    console.log('sync',arguments);
});

hacker.destroy({
    wait:true,
    success:function(){
        console.log('success:',arguments);
    },
    error:function(){
        console.log('error:',arguments);
    }
});
*/

/* validate  model.validate(attributes) */
/*
var Hacker = Backbone.Model.extend({
    validate:function(attrs){
        if(attrs.name.length < 4){
            return 'name不能少于4个字符';
        }

        if(attrs.age > 30){
            return 'age不能大于30';
        }
    }
});

var hacker = new Hacker({
    name:'hacker',
    age:21
});

hacker.on('error',function(){
    console.log('on-error:',arguments);
});

hacker.set({
    name:'PG'
},{
    error:function(){
        console.log('set-error:',arguments);
    }
});
*/


/* isValid   model.isValid() */
/*
var Hacker = Backbone.Model.extend({
    validate:function(attrs){
        if(attrs.name.length < 4){
            return 'name不能少于4个字符';
        }

        if(attrs.age > 30){
            return 'age不能大于30';
        }
    }
});

var hacker = new Hacker({
    name:'hacker',
    age:21
});

hacker.set({
    name:'PG',
    age:100
},{
    silent:true 
});

console.log(hacker.attributes);
console.log(hacker.isValid());//false
*/

/* url   model.url() */
/*
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php/'
});

var hacker = new Hacker({
    id:1,
    name:'PG',
    age:21
});

console.log(hacker.url());//ajax.php/1
hacker.save();
hacker.fetch();
*/

/* urlRoot  model.urlRoot or model.urlRoot() */
/*
var Hacker = Backbone.Model.extend({
    //urlRoot:'/hacker'
    urlRoot:function(){
        return '/hacker';
    }
});

var hacker = new Hacker({id:1});
console.log(hacker.url());// /hacker/1
*/

/* parse  model.parse(response) */
/*
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php',
    parse:function(data,xhr){
        return data;
    }
});

var hacker = new Hacker({
    id:1,
    name:'PG',
    age:21
});

hacker.fetch({
    success:function(){
        console.log(hacker.attributes);//Object { id=1,name="Musikar",age=22 }
    }
});

/*ajax.php内容*/
/*

<?php

    $id = trim($_SERVER['PATH_INFO'],'/');

    $arr = array(
        1=>array(
            'name'=>'Musikar',
            'age'=>22
        ),
        2=>array(
            'name'=>'PG',
            'age'=>21
        )
    );


    echo json_encode($arr[$id]);

*/

/* clone  model.clone() */
/*
var Hacker = Backbone.Model.extend({
    
});

var hacker = new Hacker({
    id:1,
    name:'PG',
    age:21,
    contacts:{
        qq:'389443626',
        email:'[email protected]',
        tel:'18686128512'
    }
});

hacker.attributes.contacts.email = '[email protected]';

console.log(hacker.clone().attributes.contacts.email);//[email protected]
*/

/* isNew  model.isNew() */
/*
var hacker =  new Backbone.Model({
    name:'PG',
    age:21
});

console.log(hacker.isNew());//true
hacker.id = 1;
console.log(hacker.isNew());//false
*/

/* change  model.change() */
/*
var hacker =  new Backbone.Model({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log('change:',arguments);
});

hacker.on('change:name',function(){
    console.log('change:name',arguments);
});

hacker.on('change:age',function(){
    console.log('change:age',arguments);
});


hacker.set({
    name:'Musikar',
    age:22
},{
    silent:true 
});

hacker.change();
*/

/* hasChanged  model.hasChanged([attribute]) */
/*
var hacker =  new Backbone.Model({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log(hacker.hasChanged('name'));//true
    console.log(hacker.hasChanged('age'));//true
});

hacker.set({
    name:'Musikar',
    age:22
});
*/


/* changedAttributes  model.changedAttributes([attributes]) */
/*
var hacker =  new Backbone.Model({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log(hacker.changedAttributes());//Object { name="Musikar" }
});

hacker.set({
    name:'Musikar',
    age:21
});

*/

/* previous  model.previous(attribute) */
/*
var hacker =  new Backbone.Model({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log(this.previous('name'));//PG
});

hacker.set({
    name:'Musikar',
    age:21
});
*/


/* previousAttributes  model.previousAttributes() */
/*
var Hacker = Backbone.Model.extend({
    validate:function(attrs){
        console.log('validate:',attrs);
        return 'validate fails';
    }
});

var hacker = new Hacker({
    name:'PG',
    age:21
});

hacker.on('change',function(){
    console.log(this.previousAttributes());//Object { name="PG",age=21 }
});

hacker.set({
    name:'Musikar',
    age:22
},{
    error:function(){
        console.log(hacker.attributes);
    }   
});

*/

//=================================Backbone.Collection========================================


/* extend  Backbone.Collection.extend(properties, [classProperties]) */
/*
var Hackers = Backbone.Collection.extend({
    property:'value'
},{
    classProperty:'value'
});

var hackers = new Hackers();
console.log(hackers.property);//value
console.log(Hackers.classProperty);//value
*/

/* model  collection.model */
/*
var Hacker = Backbone.Model.extend({
    
});

var hacker = new Hacker({
    name:'PG',
    age:21
});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers();
hackers.add(hacker);
hackers.add({name:'Musikar',age:22});
console.log(hackers.models.length);//2
console.log(hackers.models[0].attributes);//Object { name="PG",age=21 }
*/

/* constructor / initializenew Collection([models], [options]) */
/*
var Hacker = Backbone.Model.extend({
    
});

var hacker1 = new Hacker({
    name:'PG',
    age:21
});

var hacker2 = new Hacker({
    name:'Musikar',
    age:22
});

var Hackers = Backbone.Collection.extend({
    initialize:function(){
        console.log('initialize..');
    }
});

var hackers = new Hackers([hacker1,hacker2]);
console.log(hackers.models[1].attributes);//Object { name="Musikar",age=22 }

var hackers = new Hackers([hacker1,hacker2],{
    comparator:function(hacker){
        return hacker.get('age');
    }
});

console.log(hackers.toJSON());
*/

/* toJSON  collection.toJSON() */
/*
var collection = new Backbone.Collection([
    {name: "PG", age: 21},
    {name: "Musikar", age: 22}
]);

console.log(collection.models);
console.log(JSON.stringify(collection));
console.log(collection.toJSON());
*/

/* sync  collection.sync(method, collection, [options]) */



/* add  collection.add(models, [options]) */
/*
var hackers = new Backbone.Collection({
    
});

hackers.on('add',function(model,collection,options){
    console.log(options.index);
});

hackers.add([{name:'PG'},{name:'Musikar'}],{
    //silent:true
});

hackers.add({name:'黑客'},{at:0});
console.log(hackers.toJSON());
*/

/* remove  collection.remove(models, [options]) */
/*
var Hacker = Backbone.Model.extend({});

var hacker1 = new Hacker({
    name:'Musikar',
    age:22
});

var hacker2 = new Hacker({
    name:'Musikar',
    age:22
});

var hackers = new Backbone.Collection({
    model:Hacker
});

hackers.on('remove',function(model,collection,options){
    console.log(hackers.models.length);//2??
});

hackers.add([hacker1,hacker2]);
hackers.remove(hacker1);
*/

/* get  collection.get(id) */
/*
var Hacker = Backbone.Model.extend({});

var hacker1 = new Hacker({
    id:1,
    name:'Musikar',
    age:22
});

var hacker2 = new Hacker({
    id:2,
    name:'Musikar',
    age:22
});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers();

hackers.add([hacker1,hacker2]);

console.log(hackers.get(1).get('name'));//Musikar
console.log(hackers.get(hacker1).get('name'));//Musikar
*/


/* getByCid  collection.getByCid(cid) */
/*
var Hacker = Backbone.Model.extend({});

var hacker1 = new Hacker({
    id:1,
    name:'Musikar',
    age:22
});

var hacker2 = new Hacker({
    id:2,
    name:'Musikar',
    age:22
});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers();

hackers.add([hacker1,hacker2]);

console.log(hackers.getByCid('c0').attributes);//Object { id=1, name="Musikar", age=22 }
console.log(hackers.getByCid(hacker1).attributes);//Object { id=1, name="Musikar", age=22 }
*/

/* at  collection.at(index) */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

console.log(hackers.at(0).attributes);//Object { id=1, name="PG", age=21 }
console.log(hackers.at(100));//undefined
*/


/* push  collection.push(model, [options]) */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

hackers.push({
    id:3,
    name:'黑客',
    age:110
});

console.log(hackers.at(hackers.models.length-1).attributes);//Object { id=3, name="黑客", age=110 }
*/


/* pop  collection.pop([options]) */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

hackers.pop();
console.log(hackers.at(hackers.models.length-1).attributes);//Object { id=1, name="PG", age=21 }
*/


/* unshift  collection.unshift(model, [options]) */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

hackers.unshift({
    id:0,
    name:'黑客',
    age:119
});

console.log(hackers.at(0).attributes);//Object { id=0, name="黑客", age=119 }
*/


/* shift  collection.shift([options]) */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

hackers.shift();

console.log(hackers.at(0).attributes);//Object { id=2, name="Musikar", age=22 }
*/


/* length  collection.length */
/*
var Hacker = Backbone.Model.extend({});

var Hackers = Backbone.Collection.extend({
    model:Hacker
});

var hackers = new Hackers([{
    id:1,
    name:'PG',
    age:21
},{
    id:2,
    name:'Musikar',
    age:22
}]);

console.log(hackers.length);//2
*/


/* comparator  collection.comparator */
/*代码1
var Hacker = Backbone.Model;

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    comparator:function(hacker){
        return hacker.get('age');
    }
});

var hackers = new Hackers();
hackers.add({name:'PG',age:20});
hackers.add({name:'Musikar',age:18});
hackers.add({name:'Hacker',age:21});

console.log(hackers.pluck('age'));//[18,20,21]
*/

/*代码2
var Hacker = Backbone.Model;

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    comparator:function(hacker){
        return hacker.get('name').length;
    }
});

var hackers = new Hackers();
hackers.add({name:'PG',age:20});
hackers.add({name:'Musikar',age:18});
hackers.add({name:'Hacker',age:21});

console.log(hackers.pluck('name'));//["PG","Hacker","Musikar"]
*/

/*代码3
var Hacker = Backbone.Model;

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    comparator:function(hacker){
        return hacker.get('name').length;
    }
});

var hackers = new Hackers();
hackers.add({name:'PG',age:20});
hackers.add({name:'Musikar',age:18});
hackers.add({name:'Hacker',age:21});

console.log(hackers.pluck('name'));

hackers.at(0).set('name','Penelope Garcia');//["PG", "Hacker", "Musikar"]
console.log(hackers.pluck('name'));//["Penelope Garcia", "Hacker", "Musikar"]

hackers.sort();
console.log(hackers.pluck('name'));//["Hacker", "Musikar", "Penelope Garcia"]
*/

/*代码4
var Hacker = Backbone.Model;

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    comparator:function(hacker1,hacker2){
        if(hacker1.get('name').length > hacker2.get('name').length){
            return 1;
        }else if(hacker1.get('name').length < hacker2.get('name').length){
            return -1;
        }else{
            return 0;
        }
    }
});

var hackers = new Hackers();
hackers.add({name:'PG',age:20});
hackers.add({name:'Musikar',age:18});
hackers.add({name:'Hacker',age:21});

console.log(hackers.pluck('name'));//["PG","Hacker","Musikar"]

*/

/* sort  collection.sort([options]) */
/*
var Hacker = Backbone.Model;

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    comparator:function(hacker){
        return hacker.get('name').length;
    }
});

var hackers = new Hackers();
hackers.add({name:'PG',age:20});
hackers.add({name:'Musikar',age:18});
hackers.add({name:'Hacker',age:21});

console.log(hackers.pluck('name'));

hackers.at(0).set('name','Penelope Garcia');//["PG", "Hacker", "Musikar"]
console.log(hackers.pluck('name'));//["Penelope Garcia", "Hacker", "Musikar"]

hackers.on('reset',function(){
    console.log('reset...');
});

hackers.sort();
console.log(hackers.pluck('name'));//["Hacker", "Musikar", "Penelope Garcia"]
*/

/* pluck  collection.pluck(attribute) */
/*
var hackers = new Backbone.Collection([
    {name:'PG'},
    {name:'Hacker'},
    {name:'Musikar'}
]);

console.log(hackers.pluck('name'));//["PG", "Hacker", "Musikar"]
*/


/* where  collection.where(attributes) */
/*
var hackers = new Backbone.Collection([
    {name:'张三',age:21},
    {name:'李四',age:20},
    {name:'王五',age:22},
    {name:'赵六',age:20},
    {name:'马七',age:20}
]);

console.log(hackers.where({age:20}).length);//3
*/


/* url  collection.url or collection.url() */
/*
var Hacker = Backbone.Model.extend({
    //url:'test.php/'
});

var hacker = new Hacker({
    id:2,
    name:'Musikar',
    age:22
});

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    url:'ajax.php/'
});

var hackers = new Hackers(hacker);
hacker.fetch();//http://www.demo.com/ajax.php/2
*/


/* parse  collection.parse(response) */

/*
var Hacker = Backbone.Model.extend({
    
});

var hacker1 = new Hacker({
    id:0,
    name:'',
    age:0
});

var hacker2 = new Hacker({
    id:0,
    name:'',
    age:0
});

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    url:'ajax.php/',//[{"id":1,"name":"Musikar","age":22},{"id":2,"name":"PG","age":21}]
    parse:function(response){
        console.log(response);
    }
});

var hackers = new Hackers();
hackers.fetch({
    success:function(){
        //console.log(arguments);
        //console.log(hackers.toJSON());
    }
});
*/


/* fetch  collection.fetch([options]) */
/* reset  collection.reset(models, [options]) */
/*
var Hackers = Backbone.Collection.extend({
    url:'ajax.php'//[{"id":1,"name":"Musikar","age":22},{"id":2,"name":"PG","age":21}]
});

var hackers = new Hackers({
    id:0,
    name:'Hacker',
    age:20
});

hackers.on('reset',function(){
    //console.log('reset',arguments);
});

var xhr = hackers.fetch({
    data:{page:3},
    add:true,
    success:function(){
        //hackers.reset();
        console.log(hackers.toJSON());//[Object { id=1, name="Musikar", age=22}, Object { id=2, name="PG", age=21}]
    }
});

//console.log(xhr);
*/


/* create  collection.create(attributes, [options]) */

//====================================Backbone.Router==========================================




//====================================Backbone.sync==========================================

//console.log(Backbone.ajax);//undefined
//console.log(Backbone.sync);


/* emulateHTTP  Backbone.emulateHTTP = true */
/*
Backbone.emulateHTTP = true;

var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php'
});

var hacker = new Hacker({
    id:1,
    name:'Musikar'
});

hacker.save();//X-HTTP-Method-Override  PUT
*/

/* emulateJSON  Backbone.emulateJSON = true*/
/*
Backbone.emulateJSON = true;

var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php'
});

var hacker = new Hacker({
    id:1,
    name:'Musikar'
});

hacker.save();//model {"id":1,"name":"Musikar"}
*/


//====================================Backbone.View==========================================

//console.log(_.functions(new Backbone.View));//["$", "_configure", "_ensureElement", "bind", "delegateEvents", "initialize", "make", "off", "on", "remove", "render", "setElement", "trigger", "unbind", "undelegateEvents"]

/*
console.log(new Backbone.View({
    el:'body'
}));

console.log(new Backbone.View({
    tagName:'li'
}));

console.log(new Backbone.View({
    className:'demo'
}));

console.log(new Backbone.View({
    id:'demo'
}));

console.log(new Backbone.View({
    attributes:{
        style:'color:red;'
    }
}).$el.constructor === jQuery);//true


new Backbone.View({
    id:'demo',
    className:'demo',
    tagName:'span',
    attributes:{
        style:'color:red;',
        href:'http://www.w3hacker.com/'
    }
}).$el.text('demo').appendTo('body');
*/

/* make  view.make(tagName, [attributes], [content]) */
/*
var view = new Backbone.View();
var el = view.make('b',{'class':'demo'},'Bold!');
console.log(el.constructor);//HTMLElement {}
$('#demo').append(el);
*/

//=================================Utility================================

/* Backbone.noConflict */
/*
console.log(Backbone.noConflict());
console.log(Backbone);//undefined
*/

/* Backbone.$ */
/*
Backbone.$ = function(id){return document.getElementById(id);}

console.log(Backbone.$.toString());
/*
function (id) {
    return document.getElementById(id);
}
*/


/*Hello World
var Hacker = Backbone.Model.extend({
    name:'undefined'
});

var Hackers = Backbone.Collection.extend({
    model:Hacker,
    initialize:function(models,options){
        this.bind('add',options.view.addHacker);
    }
});

var HackerList = Backbone.View.extend({
    el:$(document),
    initialize:function(){
        this.hackers = new Hackers(null,{view:this});
    },
    events:{
        'keyup':'add'
    },
    add:function(evt){
        //delete
        if(evt.keyCode==8){
            $('#hackers li:last').remove();
            return; 
        }
        var hacker = new Hacker({name:String.fromCharCode(evt.keyCode)});
        this.hackers.add(hacker);
    },
    addHacker:function(model){
        $('#hackers').append('<li>'+model.get('name')+'</li>');
    }
});

new HackerList();

/*HTML代码

<div id="hack">Add One Hacker</div>
<ul id="hackers"></ul>

*/

/* initialize、defaults、set
var Hacker = Backbone.Model.extend({
    initialize:function(){
        console.log('initialize...');
    },
    defaults:{
        name:'Hacker',
        qq:'389443626'
    }
});

var hacker = new Hacker();
hacker.set({
    name:'Musikar'
});
console.log(hacker.toJSON());//Object { name="Musikar", qq="389443626" }
*/

/* Backbone.Model里的方法
var Hacker = Backbone.Model.extend({
    defaults:{
        name:'Hacker'
    },
    hack:function(website){
        console.log(this.get('name')+' is hacking '+website);
    }
});

var hacker =  new Hacker();
hacker.hack('www.w3hacker.com');//Hacker is hacking www.w3hacker.com
*/

/*监听属性的改变
var Hacker = Backbone.Model.extend({
    initialize:function(){
        this.bind('change:name',function(){
            console.log(arguments);
        }); 
    },
    defaults:{
        name:'Hacker'
    }
});

var hacker = new Hacker();
hacker.set({
    name:'Musikar'
});
*/


/*属性验证
var Hacker = Backbone.Model.extend({
    initialize:function(){
        this.bind('error',function(model,errorMsg){
            document.title = errorMsg;
        });
    },
    validate:function(attrs){
        if(attrs.name==''){
            return 'name不能为空';
        }else{
            document.title = 'name设置正确';
        }
    }
});

var hacker = new Hacker();
hacker.set({
    name:'Musikar'
});
*/

/*对象的获取和保存*/
/*
var Hacker = Backbone.Model.extend({
    url:'ajax.php/'
});

var hacker = new Hacker({
    name:'Musikar',
    qq:'389443626'
});

hacker.save();//POST {"name":"Musikar","qq":"389443626"}
*/

/*
var hacker = new Hacker({
    id:1,
    name:'Musikar',
    qq:'389443626'
});

hacker.save();//PUT {"id":1,"name":"Musikar","qq":"389443626"}
*/

/*
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php'
});

var hacker = new Hacker({
    id:2,
    name:'PG',
    age:21,
    gender:1
});

hacker.save();
*/

/* fetch
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php'
});

var hacker = new Hacker({
    id:2,
    name:'',
    age:'',
    gender:''
});

hacker.fetch({
    success:function(model,json){
        console.log(hacker.toJSON());//Object { id="2", name="PG", age="21", gender="1" }
    }
});

*/

/*
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php'
});

var hacker = new Hacker({
    id:2,
    name:'',
    age:'',
    gender:''
});

hacker.fetch({
    url:'test.php'
});
*/

//===============================Backbone.Collection=====================================
/*
var Hacker = Backbone.Model.extend({
    urlRoot:'ajax.php',
    defaults:{
        
    }
});

var Hackers = Backbone.Collection.extend({
    url:'ajax.php',
    model:Hacker
});

var h1 = new Hacker({title:'Musikar'});
var h2 = new Hacker({title:'PG'});
var h3 = new Hacker({title:'黑客'});

var hackers = new Hackers();
//添加
hackers.add([h1,h2,h3]);
console.log(hackers.toJSON());//[Object { title="Musikar"}, Object { title="PG"}, Object { title="黑客"}]
//删除
hackers.remove(h1);
console.log(hackers.toJSON());//[Object { title="PG"}, Object { title="黑客"}]
//遍历
hackers.each(function(model){
    console.log(model.toJSON());
});

hackers.bind('reset',function(){
    hackers.each(function(hacker){
        $('#hackers').append('<li>'+hacker.get('name')+'</li>');
    });
});

hackers.fetch();
*/

//================================Backbone.Router========================================
/* Hello World
var Router = Backbone.Router.extend({
    routes:{
        '*actions':'defaultRoute'
    },
    defaultRoute:function(){
        console.log(arguments);
    }
});

var router = new Router();
Backbone.history.start();
*/

//传递参数
/*
var Router = Backbone.Router.extend({
    routes:{
        "get/:id":"defaultRoute"
    },
    defaultRoute:function(){
        console.log(arguments);//["1"]
    }
});

var router = new Router();
Backbone.history.start();
*/

/*
var Router = Backbone.Router.extend({
    routes:{
        ":id/:name":"defaultRoute"
    },
    defaultRoute:function(){
        console.log(arguments);//["1", "Musikar"]
        //http://www.demo.com/#1/Musikar
    }
});

var router = new Router();
Backbone.history.start();
*/

//================================Backbone.View=====================================
/* What's this?? underscore 
console.log(_.template($('#template').text())({label:'Hello World'}));

<script type="text/template" id="template">
    <label for=""><%=label%></label>
    <input type="text" name="input" id="input" />   
    <input type="button" value="Search" id="search" />
</script>
*/

/* 创建一个view
var View = Backbone.View.extend({
    initialize:function(){
        console.log(arguments);
    }
});

var view = new View();
console.log(_.functions(view));//["$", "_configure", "_ensureElement", "bind", "constructor", "delegateEvents", "initialize", "make", "off", "on", "remove", "render", "setElement", "trigger", "unbind", "undelegateEvents"]
*/

/*
var View = Backbone.View.extend({
    el:$('#search'),
    initialize:function(){
        this.render({
            label:'标签：'
        });
    },
    render:function(obj){
        var t = _.template($('#template').text(),obj);
        $(this.el).html(t);
    },
    events:{
        'click #search':'search'
    },
    search:function(){
        alert($('#input').val());
    }
});

var view = new View();
*/