var app = new Vue({
    el: '#modal-subway-departure',
    data: {
        message: 'Метро',
        selectLine: Number('1'),
        checkedStations: [],
        metroStations: [],
        metroLines: [],
    },
    computed: {
        selectMetroStationsForLine() {
            return this.metroStations.filter(function (station) {
                return station.line_id == this;
            }, this.selectLine).sort(compare('order'));
        },
        selectMetroStations() {
            let items = [];
            items = this.selectMetroStationsForLine;
            return items;
        },
        selectMetroIds() {
            return this.selectMetroStations.map(function (item) {
                let metroId = item.id
                return metroId;
            }, this).flat();
        },
        getMetroStations() {
            let items = this.selectMetroStations.map(function (item) {
                return item;
            });
            let first = items.splice(0, Math.ceil(items.length / 2));
            return [first, items];
        },
        currentMetroLine() {
            return this.metroLines.find(line => line.id === this.selectLine);
        },
    },
    methods: {
        metroForLine(line) {
            return this.metroStations.filter(function (station) {
                return station.line_id == this.id;
            }, line).map(function (station) {
                return station['id'];
            });
        },
        countMetroForLine(line) {
            let value = this.metroForLine(line).filter(x => this.checkedStations.includes(x)).length;
            return value > 0 ? value : '';
        },
        showLine(id) {
            this.selectLine = id;
        },
        isActiveLine(line) {
            return line.id === this.selectLine;
        },
    },
    created: function() {
        axios.get('/service/checked-json?id=4716&place=2')
            .then((response) => {
                this.checkedStations = response.data;
            }),
        axios.get('/service/stations-json?id=4716&place=2')
            .then((response) => {
                this.metroStations = response.data.metroStations;
            }),
        axios.get('/service/lines-json?id=4716&place=2')
            .then((response) => {
                this.metroLines = response.data.metroLines.sort(compare('id'));
            })
    },
})

function compare(field, order) {
    var len = arguments.length;
    if(len === 0) {
        return (a, b) => (a < b && -1) || (a > b && 1) || 0;
    }
    if(len === 1) {
        switch(typeof field) {
            case 'number':
                return field < 0 ?
                    ((a, b) => (a < b && 1) || (a > b && -1) || 0) :
                    ((a, b) => (a < b && -1) || (a > b && 1) || 0);
            case 'string':
                return (a, b) => (a[field] < b[field] && -1) || (a[field] > b[field] && 1) || 0;
        }
    }
    if(len === 2 && typeof order === 'number') {
        return order < 0 ?
            ((a, b) => (a[field] < b[field] && 1) || (a[field] > b[field] && -1) || 0) :
            ((a, b) => (a[field] < b[field] && -1) || (a[field] > b[field] && 1) || 0);
    }
    var fields, orders;
    if(typeof field === 'object') {
        fields = Object.getOwnPropertyNames(field);
        orders = fields.map(key => field[key]);
        len = fields.length;
    } else {
        fields = new Array(len);
        orders = new Array(len);
        for(let i = len; i--;) {
            fields[i] = arguments[i];
            orders[i] = 1;
        }
    }
    return (a, b) => {
        for(let i = 0; i < len; i++) {
            if(a[fields[i]] < b[fields[i]]) return orders[i];
            if(a[fields[i]] > b[fields[i]]) return -orders[i];
        }
        return 0;
    };
}