bobamo /plugins/static/public/js/libs/bobamo/list.js

Language Javascript Lines 148
MD5 Hash 8666e8e6e96596193da84d6c5fce5a06
Repository git://github.com/jspears/bobamo.git View Raw File
| Open JSFiddle
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
// Filename: views/${schema.modelName}/list
define([
    'jquery',
    'underscore',
    'Backbone',
    'replacer',
    'libs/table/jquery.bobamo-paginate',
    'libs/table/jquery.sorter'

], function ($, _, Backbone, replacer) {
    "use strict";
    function _null(v) {
        return v != null;
    };
    function _dir(v) {
        if (v.direction)
            return replacer('<span class="sortable elementActivate" data-field="{field}" data-label="{label}" data-direction="{direction}">{label}</span>',v);

        return null;
    };
    var ListItemView = Backbone.View.extend({
        tagName:"tr",
        initialize:function (options) {
            this.model.bind("change", this.render, this);
            this.model.bind("destroy", this.close, this);

      //      _.bind(this.format, this);
            return this;
        },
        format:function(field, model, schema){
            return schema.format ? schema.format(field, model, schema) : model.get(field);
        },
        _fields:{},
        _format:function(field){
            var schema = field in this._fields ? this._fields[field] : (this._fields[field] = this.schema(field, this.model));
            return this.format(field, this.model, schema)
        },
        schema:function(field, model){
            if (!(model || field))
                return null;
            var fields = field.split('.');

            var schema = model.schema;
            if (!schema) return null;
            var val = schema[fields.shift()];
            while(fields.length){
                var key = fields.shift();
                if (val && val.subSchema)
                    val = val.subSchema[key];
                else{
                    console.log('no schema for ', fields, field, key);
                    return null;
                }
            }
            return val;
        },
        render:function (eventName) {
            var tmpl = (this.template || this.options.template)({item:this.model, format:_.bind(this._format, this)});
            var $el = $(this.el);
            $el.html(tmpl);
            return this;
        }

    });
    var ListView = Backbone.View.extend({
        tagName:'div',
        classNames:['span7'],
        events:{
            'paginate-change .pager_table':'doPage',
            'sorter-change .sortable':'onSort'
        },
        initialize:function () {
            if (!this.template) {
                throw new Error('template must be defined');
            }
            if (!this.collection){
                throw new Error('collection must be defined');
            }
            this.collection.on('reset', this.renderList, this);
            this.collection.on('fetch', this.renderList, this);
            return this;
        },
        itemView:ListItemView,
        renderItem:function (item) {
            var template = this.listItemTemplate;
            if (this.$ul) {
                var lel = new ListItemView({model:item, template:template}).render().el;
                this.$ul.append(lel);
            }
            return this;
        },
        renderList:function () {
            console.log('renderList',arguments)
            this.$ul = this.$el.find('tbody').empty();
            _.each(this.collection.models, this.renderItem, this);
            this.$paginate.paginate('update', {sort:this.sort_str ? ' sorting by: ' + this.sort_str : '', total:this.collection.total});
            $('.sortable', this.$table).sorter();
            return this;
        },
        sorts:[],
        doPage:function (evt) {
            this.update('Loading page <b>' + evt.page + '</b> of {items}');
            return this;
        },
        update:function (message, opt) {
            var $p = this.$paginate.paginate('wait', message);

            var self = this;
            var data = _.extend({
                limit:parseInt($p.attr('data-limit')),
                skip:Math.max(0, parseInt($p.attr('data-skip')))
            },opt);
            var sort = [];
            _.each(this.sorts, function (v, k) {
                if (!v.direction) return;
                sort.push([v.field, v.direction].join(':'));
            });

            data.sort = sort.join(',');
            this.collection.fetch({data:data});
            return this;
        },
        onSort:function (evt) {
            var obj = {field:evt.field, direction:evt.direction, label:evt.label};
            this.sorts = _.filter(this.sorts, function (v, k) {
                return v.field != obj.field;
            })
            this.sorts.unshift(obj);
            var str = _(this.sorts).map(_dir).filter(_null).join(', ')
            this.sort_str = str;
            this.update('Sorting {items} ' + ( str ? 'by ' + str : 'naturally' )+'.');

            return this;
        },
        render:function (obj) {
            this.$container = obj && obj.container ? $(obj.container) : $('#content');
            this.$table = $(this.template());
            this.$paginate = $('.pager_table', this.$table).paginate();
            this.$el.append(this.$table);
            this.update('Loading {items}');
            this.$container.empty().append(this.$el);
            return this;
        }
    });

    return ListView;
});
Back to Top