Javascript BackboneJS是在集合中重新排列模型的最佳方法，同时为每个模型维护0索引序号属性

我在这里遇到了一个问题，我有一个BackboneJS模型集合，每个模型都有一个“ordinal”属性，用于跟踪其在集合中的顺序

这是我的播放数据

var ex_group_test_data = [{

            title: 'PRE EXERCISE',
            id:         0,
            ordinal:    1,

            group_items: [{
                id:         0,
                ordinal:    0,
                title: 'item 1'
            },{
                id:         1,
                ordinal:    1,
                title: 'item 2'
            }]

        },{

            title: 'MAIN PART',
            id:         1,
            ordinal:    0,

            group_items: [{
                id:             2,
                ordinal:        0,
                title:          'item 3',
                description:    'testing descrip'
            },{
                id:         3,
                ordinal:    1,
                title: 'item 4'
            }]

        },{

            title: 'POST EXERCISE BS',
            id:         2,
            ordinal:    2,

            group_items: [{
                id:             2,
                ordinal:        0,
                title:          'item 5',
                description:    'testing descrip'
            },{
                id:         3,
                ordinal:    1,
                title: 'item 6'
            }]

        }];

以下是我的主干系列的要点

        Collections.Exercise_Groups = Backbone.Collection.extend({
            model: Models.Exercise_Group,
            comparator: function(model){
                return model.get('ordinal');
            },
            initialize: function(){

                return this;
            }

从简单开始，我希望能够将模型按+1或-1顺序移动，并保持集合中所有模型的0索引

最终，我想把这个水平，我可以在模型或删除他们从任何位置，仍然保持我的0-索引，或采取一个模型，并将其移动+/-X位置

有人推荐了实现这一点的方法吗

编辑1

我已经想出了一个解决方案，我可能想在明天我真正睡上一觉后优化这个。它维护集合中模型“序号”的0索引，无论我是相对于原始位置向前还是向后移动模型

编辑2 呃，实际上它在边缘案例上有错误

/**
             * Move model to a specified location. 
             * 
             * @param   int [model id]
             * @param   int [mew item position]
             * @return  this
             */
            move_to: function(m_id, new_pos){

                //keep within range
                if(new_pos < 0)
                    new_pos = 0;
                else if(new_pos > (this.length - 1))
                    new_pos = this.length - 1;


                var model = this.get(m_id),
                    old_pos = model.get('ordinal');


                model.set({
                    ordinal: new_pos
                });
                if(new_pos == old_pos){
                    //trigger associated events
                    this.sort();
                    return this;
                }

                //update indexes of affected models
                this.each(function(m){

                    //ordinal of current model in loop
                    var m_ordinal = m.get('ordinal');

                    //skip if this is the model we just updated
                    if(m.get('id') == m_id)
                        return;

                    if(old_pos < new_pos){
                        //moving down, ordinal is increasing

                        if(m_ordinal <= new_pos && m_ordinal != 0){
                            //this is in the range we care about
                            m.set({
                                ordinal: m.get('ordinal') - 1
                            });

                        }

                    }else if(old_pos > new_pos){
                        //moving up, ordinal is decreasing                  


                        if(m_ordinal >= new_pos && (m_ordinal != (this.length - 1))){
                            //this is in the range we care about
                            m.set({
                                ordinal: m.get('ordinal') + 1
                            });

                        }

                    }

                });

                this.sort();
                return this;

            }

/**
*将模型移动到指定位置。
* 
*@param int[模型id]
*@param int[新项目位置]
*@还这个
*/
移动到：功能（m\U id，新位置）{
//保持在射程之内
如果（新位置<0）
新位置=0；
else if（新位置>（this.length-1））
new_pos=this.length-1；
var模型=此.get（m_id），
old_pos=model.get（'ordinal'）；
模型集({
序号：新位置
});
如果（新位置==旧位置）{
//触发相关事件
this.sort（）；
归还这个；
}
//更新受影响模型的索引
此。每个功能（m）{
//回路中电流模型的序号
var m_ordinal=m.get（'ordinal'）；
//如果这是我们刚刚更新的模型，请跳过
if（m.get（'id'）==m_id）
返回；
如果（旧位置<新位置）{
//下移，序数增加
if（序号新位置）{
//往上看，序数在减少
如果（m_序数>=新位置&（m_序数！=（this.length-1）））{
//这是我们关心的范围
m、 设置({
序数：m.get（'ordinal'）+1
});
}
}
});
this.sort（）；
归还这个；
}

编辑3 好的，我想我已经解决了所有的问题，一些简单的范围问题。下面是一些我已经彻底测试过的代码，我相信它是有效的

/**
                 * Move model to a specified location. 
                 * 
                 * @param   int [model id]
                 * @param   int [mew item position]
                 * @return  this
                 */
                move_to: function(m_id, new_pos){

                    //keep within range
                    if(new_pos < 0)
                        new_pos = 0;
                    else if(new_pos > (this.length - 1))
                        new_pos = this.length - 1;


                    var model = this.get(m_id),
                        old_pos = model.get('ordinal');

                    log('old_pos ' + old_pos);
                    log('new_pos ' + new_pos);


                    model.set({
                        ordinal: new_pos
                    });
                    if(old_pos == new_pos){
                        //trigger associated events
                        this.sort();
                        return this;
                    }

                    var _this = this;
                    //update indexes of affected models
                    this.each(function(m){

                        //ordinal of current model in loop
                        var m_ordinal = m.get('ordinal');

                        //skip if this is the model we just updated
                        if(m.get('id') == m_id)
                            return;

                        if(old_pos < new_pos){
                            //moving down, ordinal is increasing

                            if(m_ordinal <= new_pos && !(m_ordinal <= 0)){
                                //this is in the range we care about
                                m.set({
                                    ordinal: m.get('ordinal') - 1
                                });

                            }

                        }else if(old_pos > new_pos){
                            //moving up, ordinal is decreasing                  
                             log('p1');

                            if(m_ordinal >= new_pos && !(m_ordinal >= (_this.length - 1))){
                                //this is in the range we care about
                                m.set({
                                    ordinal: m.get('ordinal') + 1
                                });

                            }

                        }

                    });

                    this.sort();                    
                    return this;

                }

/**
*将模型移动到指定位置。
* 
*@param int[模型id]
*@param int[新项目位置]
*@还这个
*/
移动到：功能（m\U id，新位置）{
//保持在射程之内
如果（新位置<0）
新位置=0；
else if（新位置>（this.length-1））
new_pos=this.length-1；
var模型=此.get（m_id），
old_pos=model.get（'ordinal'）；
日志（“旧位置”+旧位置）；
日志（“新位置”+新位置）；
模型集({
序号：新位置
});
如果（旧位置==新位置）{
//触发相关事件
this.sort（）；
归还这个；
}
var_this=这个；
//更新受影响模型的索引
此。每个功能（m）{
//回路中电流模型的序号
var m_ordinal=m.get（'ordinal'）；
//如果这是我们刚刚更新的模型，请跳过
if（m.get（'id'）==m_id）
返回；
如果（旧位置<新位置）{
//下移，序数增加
如果（m_ordinal=new_pos&&！（m_ordinal>=（_this.length-1）））{
//这是我们关心的范围
m、 设置({
序数：m.get（'ordinal'）+1
});
}
}
});
this.sort（）；
归还这个；
}

编辑4

发现了另一个bug，修补了它

Backbone.Collection.prototype.move_to = function(m_id, new_pos) {

    //keep within range
    if(new_pos < 0)
        new_pos = 0;
    else if(new_pos > (this.length - 1))
        new_pos = this.length - 1;


    var model = this.get(m_id),
        old_pos = model.get('ordinal');

    log('old_pos ' + old_pos);
    log('new_pos ' + new_pos);

    model.set({
        ordinal: new_pos
    });
    if(old_pos == new_pos){
        //trigger associated events
        this.sort();
        return this;
    }

    var _this = this;
    //update indexes of affected models
    this.each(function(m){

        log(m.id);

        //ordinal of current model in loop
        var m_ordinal = m.get('ordinal');

        //skip if this is the model we just updated
        if(m.get('id') == m_id)
            return;

        if(old_pos < new_pos){
            //moving down, ordinal is increasing

            if(m_ordinal <= new_pos && m_ordinal >= old_pos && !(m_ordinal <= 0)){
                //this is in the range we care about
                m.set({
                    ordinal: m.get('ordinal') - 1
                }, {
                    silent: true
                });

            }

        }else if(old_pos > new_pos){
            //moving up, ordinal is decreasing                  
             log('p1');

            if(m_ordinal >= new_pos && m_ordinal <= old_pos && !(m_ordinal >= (_this.length - 1))){
                //this is in the range we care about
                m.set({
                    ordinal: m.get('ordinal') + 1
                }, {
                    silent: true
                });

            }

        }

    });

    this.sort();                    
    return this;
};

Backbone.Collection.prototype.move\u to=函数（m\u id，新位置）{
//保持在射程之内
如果（新位置<0）
新位置=0；
else if（新位置>（this.length-1））
new_pos=this.length-1；
var模型=此.get（m_id），
old_pos=model.get（'ordinal'）；
日志（“旧位置”+旧位置）；
日志（“新位置”+新位置）；
模型集({
序号：新位置
});
如果（旧位置==新位置）{
//触发相关事件
this.sort（）；
归还这个；
}
var_this=这个；
//更新受影响模型的索引
此。每个功能（m）{
日志（m.id）；
//回路中电流模型的序号
var m_ordinal=m.get（'ordinal'）；
//如果这是我们刚刚更新的模型，请跳过
如果（m.get（'id'）==m_
// Your Collection

removeAt: function(options) {
  if (options.at) {
    this.remove(this.at(options.at));
  }
}

// Your Collection

moveUp: function(model) { // I see move up as the -1
  var index = this.indexOf(model);
  if (index > 0) {
    this.remove(model, {silent: true}); // silence this to stop excess event triggers
    this.add(model, {at: index-1});
  }
}

moveDown: function(model) { // I see move up as the -1
  var index = this.indexOf(model);
  if (index < this.models.length) {
    this.remove(model, {silent: true}); // silence this to stop excess event triggers
    this.add(model, {at: index+1});
  }
}

// Your Model

moveUp: function() {
  this.collection.moveUp(this);
}

// And the same for moveDown

// Your collection

initialize: function(options?) {
  ...
  this.on('add remove', this.updateModelOrdinals);
  ...
},

...

updateModelOrdinals: function() {
  this.each(function(model, index) {
    this.model.set('ordinal', index);
  });
}