'use strict';

/*@
Ox.ColumnList <f> Column List Widget
    experimental
@*/

Ox.ColumnList = function(options, self) {

    self = self || {};
    var that = Ox.Element({}, self)
        .defaults({
            columns: [],
            custom: {},
            items: [],
            list: 'table',
            resize: null,
            width: 768
        })
        .options(options || {})
        .update({
            width: function() {
                self.columnWidths = getColumnWidths();
                self.$panel.size(0, self.columnWidths[0]);
                self.$panel.size(2, self.columnWidths[2]);
                self.$lists.forEach(function($list, i) {
                    $list.options({itemWidth: self.columnWidths[i]});
                });
            }
        })
        .addClass('OxColumnList');

    self.columnWidths = getColumnWidths();
    self.numberOfColumns = self.options.columns.length;

    self.$lists = self.options.columns.map(function(column, i) {
        //Ox.print('SELECTED::', self.options.selected[i]);
        return Ox.CustomList({
                item: self.options.columns[i].item,
                itemHeight: self.options.columns[i].itemHeight,
                items: i == 0 ? self.options.items : [],
                itemWidth: self.columnWidths[i],
                keys: self.options.columns[i].keys,
                max: self.options.columns[i].max,
                resize: self.options.resize,
                scrollbarVisible: true,
                selected: self.options.columns[i].selected,
                sort: self.options.columns[i].sort,
                unique: 'id'
            })
            .bindEvent({
                key_left: function() {
                    if (i > 0) {
                        self.$lists[i - 1].gainFocus();
                        that.triggerEvent('select', {
                            id: self.options.columns[i - 1].id,
                            ids: self.$lists[i - 1].options('selected')
                        });
                    }
                },
                key_right: function() {
                    var index, object, selected = self.$lists[i].options('selected');
                    if (selected.length) {
                        if (i < self.numberOfColumns - 1) {
                            if (self.$lists[i + 1].options('selected').length == 0) {
                                self.$lists[i + 1].selectPosition(0);
                            }
                            self.$lists[i + 1].gainFocus();
                            that.triggerEvent('select', {
                                id: self.options.columns[i + 1].id,
                                ids: self.$lists[i + 1].options('selected')
                            });
                        }
                    }
                },
                select: function(data) {
                    var items = [];
                    self.options.columns[i].selected = data.ids;
                    if (i < self.numberOfColumns - 1) {
                        data.ids.forEach(function(id) {
                            var index;
                            if (i == 0) {
                                index = Ox.getIndexById(self.options.items, id);
                                items = items.concat(
                                    self.options.items[index].items
                                );
                            } else if (i == 1) {
                                index = [];
                                Ox.forEach(self.options.columns[0].selected, function(id_) {
                                    index[0] = Ox.getIndexById(
                                        self.options.items, id_
                                    );
                                    index[1] = Ox.getIndexById(
                                        self.options.items[index[0]].items, id
                                    );
                                    if (index[1] > -1) {
                                        return false;
                                    }
                                });
                                items = items.concat(
                                    self.options.items[index[0]].items[index[1]].items
                                );
                            }
                        });
                        self.$lists[i + 1].options({items: items})
                    }
                    if (i == 0 || data.ids.length) {
                        that.triggerEvent('select', {
                            id: column.id,
                            ids: data.ids
                        });
                    } else {
                        self.$lists[i - 1].gainFocus();
                        that.triggerEvent('select', {
                            id: self.options.columns[i - 1].id,
                            ids: self.$lists[i - 1].options('selected')
                        });
                    }
                }
            });
    });

    self.$panel = Ox.SplitPanel({
        elements: self.$lists.map(function($list, index) {
            return Ox.extend(
                {element: $list},
                index == 1 ? {} : {size: self.columnWidths[index]}
            );
        }),
        orientation: 'horizontal'
    });

    that.setElement(self.$panel);

    function getColumnWidths() {
        return Ox.splitInt(self.options.width, 3);
    }

    return that;

};