Getting a day range string based on day selected

Question

Suppose I have a list of days that the user can select (they can select multiple).

Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday. With each having a number associated with it(0-6). 0 being Sunday and 6 being Saturday:

vm.weekDays = [
        {name: 'Sunday', number: 0},
        {name: 'Monday', number: 1},
        {name: 'Tuesday', number: 2},
        {name: 'Wednesday', number: 3},
        {name: 'Thursday', number: 4},
        {name: 'Friday', number: 5},
        {name: 'Saturday', number: 6},
    ]

Suppose the user selects Sunday, Monday, Tuesday, we should get the string "Sunday - Tuesday". However if the user selects Sunday, Monday, Tuesday, Thursday, we should get the string "Sunday - Tuesday, Thursday". And if the user selects Sunday, Tuesday, Thursday, then they should see exactly that.

Currently, I'm storing the strings in an array. Then, I'll use that to display the strings.

Here's what I have so far:

function test() {

        vm.display = [];

        var test = _.sortBy(vm.sWeekDays, 'number');

        var start = 0;
        var end = 0;
        if(test.length > 1){
            for(var i=0; i <= test.length-2; i++){
                if(test[i].number+1 != test[i+1].number) {
                    start = i + 1;
                    end = i;
                    vm.display.push(test[i].name);
                }
                end = i+1;
            }
            vm.display.push(test[start].name + " - " + test[end].name);
        } else {
            vm.display.push(test[0].name);
        }
    }

Currently, I get the consecutive days to show up, but if I select from Sunday to Tuesday and Thursday it doesn't display correctly.

Any help is greatly appreciated.

Answer 1

I edited your code a little bit but I hope the answer is clear. Here's my implementation

 var vm = {};
 vm.weekDays = [{
     name: 'Sunday',
     number: 0
 }, {
     name: 'Monday',
     number: 1
 }, {
     name: 'Tuesday',
     number: 2
 }, {
     name: 'Wednesday',
     number: 3
 }, {
     name: 'Thursday',
     number: 4
 }, {
     name: 'Friday',
     number: 5
 }, {
     name: 'Saturday',
     number: 6
 }, ]

 function formatSelected(selected) {
     vm.display = [];
     selected = _.sortBy(selected, 'number'); //this could be vm.selected instead of passing it as a parameter

     var lastnumber = 0,
         template = {
             name: '',
             number: 0
         },
         last,
         list = [];

     if (selected.length > 0) {
        last = selected[0];
        for (var i = 0; i < selected.length; i++) {
            if (last) {
                var left = selected[i - 1] ? selected[i - 1] : angular.copy(template);
                console.log(selected[i].number - left.number)

                if (i > 0 && selected[i].number - left.number > 1) {
                    list.push(((left.name != last.name) ? (last.name + '-') : '') + left.name);
                    last = selected[i];
                }
                if((i == (selected.length - 1))) {
                    list.push(((selected[i].name != last.name) ? (last.name + '-') : '') + selected[i].name);
                }
            } else {
                last = selected[i];
            }
        }
    }

     vm.display = list;
 };

Then you could call the function with an array

 formatSelected([{
     name: 'Sunday',
     number: 0
 }, {
     name: 'Monday',
     number: 1
 }, {
     name: 'Tuesday',
     number: 2
 }, {
     name: 'Wednesday',
     number: 3
 }, {
     name: 'Saturday',
     number: 6
 }, ]);

I edited the solution to handle array such as:

formatSelected([{ name: 'Sunday', number: 0}, { name: 'Tuesday', number: 2}, { name: 'Thursday', number: 4}]);

Answer 2

We can have a map to store the range, and then we pares the map to result string.

// The map structure 
[
    [{
        name: 'Sun',
        number: 0
    }, {
        name: 'Mon',
        number: 1
    }, {
        name: 'Tue',
        number: 2
    }],
    [{
        name: 'Thu',
        number: 4
    }]
]

After this, we check each range whether it need convert to 'day1 - day3' or 'day1, day2'.

Please check this JSFiddle