Adjusting Angular.js model based on browser width

I have an Array of 5 objects, some key values need to be changed based on the browser width. ie: 5 cols, 4 cols, 3 cols or 2.

vs.streams is an Array which is tied to a AngularJS model. When the selected value is true, that data will be called via an API And displays in their appropriate columns.

```
function checkBrowserWidth() {
var w = window.innerWidth;
console.log('w = ', w);

toggleStreams();

if (w > 1400) {
console.log('5 columns');
vs.streams = [
{ name: 'Twitter', value: 'twitter', selected: true, previous: true },
{ name: 'News', value: 'news', selected: true, previous: true },
{ name: 'Financial News', value: 'financial', selected: true, previous: true },
{ name: 'Blogs', value: 'blogs', selected: true, previous: true },
{ name: 'Forums', value: 'forums', selected: true, previous: true }
];
} else if (w > 1200 && w 1100 && w < 1200) {
console.log('3 columns');
vs.streams = [
{ name: 'Twitter', value: 'twitter', selected: true, previous: true },
{ name: 'News', value: 'news', selected: true, previous: true },
{ name: 'Financial News', value: 'financial', selected: true, previous: true },
{ name: 'Blogs', value: 'blogs', selected: false, previous: false },
{ name: 'Forums', value: 'forums', selected: false, previous: false }
];
} else if (w < 1100) {
console.log('2 columns');
vs.streams = [
{ name: 'Twitter', value: 'twitter', selected: true, previous: true },
{ name: 'News', value: 'news', selected: true, previous: true },
{ name: 'Financial News', value: 'financial', selected: false, previous: false },
{ name: 'Blogs', value: 'blogs', selected: false, previous:

You could shorten the toggleStreams function:

function toggleStreams(cols) {
    vs.streams[2].selected = vs.streams[2].previous = (cols >=3);
    vs.streams[3].selected = vs.streams[3].previous = (cols >=4);
    vs.streams[4].selected = vs.streams[4].previous = (cols >=5);      
}

StackExchange Code Review Q#98382, answer score: 2