Dynamic nav bar

navBarStep.js

var steps = {
  floorplan: {
    display: 'ResourceService.FloorPlan',
    url: "/floorplan",
    icon: "floorplan",
    isEnabled: true,
    position: 6
  },
  combinations: {
    display: 'ResourceService.TableCombinations',
    url: "/combinations",
    icon: "combinations",
    isEnabled: true,
    position: 2
  },
  'reservation-availability': {
    display: "Reservation",
    url: "/reservation-availability",
    icon: "reservation",
    isEnabled: false,
    position: 3
  },
  shift: {
    display: 'ResourceService.Schedule',
    url: "/shift",
    icon: "schedule",
    isEnabled: true,
    position: 1
  },
  calendar: {
    display: 'ResourceService.SpecialDays',
    //TODO: Need to rename URL endpoint to something like SpecialDays
    url: "/calendar",
    icon: "specialdays",
    isEnabled: true,
    position: 5
  },
  publish: {
    display: 'ResourceService.Publish',
    url: "/publish",
    icon: "publish",
    isEnabled: true,
    position: 4
  }
};

var mapFunc = function(val){
  if (steps[val].isEnabled) {
    steps[val].name = val;
    return steps[val];
  }
  return null;
};
var SortByPosition = function(prev, current) {

  if (steps[prev].position < steps[current].position) {
    return -1;
  } else if (steps[prev].position > steps[current].position) {
    return 1;
  }
  return 0;
};

var filterNull = function(val) { return val !== null; };

var mapPrevNextOrder = function(val, index, arr){
  if (index === 0) {
    val.prev = 'welcome';
  } else {
    val.prev = arr[index-1].name;
  }

  if (index === arr.length-1) {
    val.next = 'welcome';
  } else {
    val.next = arr[index+1].name;
  }
  return val;
};

var newSteps = Object.keys(steps)
  .sort(SortByPosition)
  .map(mapFunc)
  .filter(filterNull)
  .map(mapPrevNextOrder);
console.log(newSteps);

the order is:

1. convert object to array
2. remove disabled features
3. sort it by position
4. filter null values
5. create prev and next values

another way is using reduce instead of map

var steps = {
  floorplan: {
    display: 'ResourceService.FloorPlan',
    url: "/floorplan",
    icon: "floorplan",
    isEnabled: true,
    position: 6
  },
  combinations: {
    display: 'ResourceService.TableCombinations',
    url: "/combinations",
    icon: "combinations",
    isEnabled: true,
    position: 2
  },
  'reservation-availability': {
    display: "Reservation",
    url: "/reservation-availability",
    icon: "reservation",
    isEnabled: false,
    position: 3
  },
  shift: {
    display: 'ResourceService.Schedule',
    url: "/shift",
    icon: "schedule",
    isEnabled: true,
    position: 1
  },
  calendar: {
    display: 'ResourceService.SpecialDays',
    //TODO: Need to rename URL endpoint to something like SpecialDays
    url: "/calendar",
    icon: "specialdays",
    isEnabled: true,
    position: 5
  },
  publish: {
    display: 'ResourceService.Publish',
    url: "/publish",
    icon: "publish",
    isEnabled: true,
    position: 4
  }
};

var a = Object.keys(steps)
.sort(SortByPosition)
.reduce(function(prev, curr, index, arr){
  if (!!steps[curr].isEnabled) {
    prev.push(
        {
            name: curr,
            display: steps[curr].display,
            url: steps[curr].url,
            icon: steps[curr].icon,
            prev: arr[index-1] ? arr[index-1] : 'welcome',
            next: arr[index+1] ? arr[index+1] : 'welcome',
        }
    );   
  }
  return prev;
},[]);
console.log(a);