first commit

public/assets/js/app-calendar-events.js

@@ -0,0 +1,142 @@
+// sample calendar events data
+
+'use strict'
+
+var curYear = moment().format('YYYY');
+var curMonth = moment().format('MM');
+
+// Calendar Event Source
+var azCalendarEvents = {
+  id: 1,
+  events: [
+    {
+      id: '1',
+      start: curYear+'-'+curMonth+'-08T08:30:00',
+      end: curYear+'-'+curMonth+'-08T13:00:00',
+      title: 'BootstrapDash Meetup',
+      backgroundColor: '#bff2f2',
+      borderColor: '#00cccc',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },{
+      id: '2',
+      start: curYear+'-'+curMonth+'-10T09:00:00',
+      end: curYear+'-'+curMonth+'-10T17:00:00',
+      title: 'Design Review',
+      backgroundColor: '#e0e4f4',
+      borderColor: '#0a2ba5',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },{
+      id: '3',
+      start: curYear+'-'+curMonth+'-13T12:00:00',
+      end: curYear+'-'+curMonth+'-13T18:00:00',
+      title: 'Lifestyle Conference',
+      backgroundColor: '#ffd5cc',
+      borderColor: '#ff5733',
+      description: 'Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi...'
+    },{
+      id: '4',
+      start: curYear+'-'+curMonth+'-15T07:30:00',
+      end: curYear+'-'+curMonth+'-15T15:30:00',
+      title: 'Team Weekly Brownbag',
+      backgroundColor: '#d2e0ff',
+      borderColor: '#0373f3',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },{
+      id: '5',
+      start: curYear+'-'+curMonth+'-17T10:00:00',
+      end: curYear+'-'+curMonth+'-19T15:00:00',
+      title: 'Music Festival',
+      backgroundColor: '#bfdeff',
+      borderColor: '#007bff',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },{
+      id: '6',
+      start: curYear+'-'+curMonth+'-08T13:00:00',
+      end: curYear+'-'+curMonth+'-08T18:30:00',
+      title: 'Attend Lea\'s Wedding',
+      backgroundColor: '#d5c2f3',
+      borderColor: '#560bd0',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    }
+  ]
+};
+
+// Birthday Events Source
+var azBirthdayEvents = {
+  id: 2,
+  backgroundColor: '#cbfbb0',
+  borderColor: '#3bb001',
+  events: [
+    {
+      id: '7',
+      start: curYear+'-'+curMonth+'-01T18:00:00',
+      end: curYear+'-'+curMonth+'-01T23:30:00',
+      title: 'Socrates Birthday',
+      backgroundColor: '#d8fed1',
+      borderColor: '#23bf08',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },
+    {
+      id: '8',
+      start: curYear+'-'+curMonth+'-21T15:00:00',
+      end: curYear+'-'+curMonth+'-21T21:00:00',
+      title: 'Reynante\'s Birthday',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    },
+    {
+      id: '9',
+      start: curYear+'-'+curMonth+'-23T15:00:00',
+      end: curYear+'-'+curMonth+'-23T21:00:00',
+      title: 'Pauline\'s Birthday',
+      description: 'In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis az pede mollis...'
+    }
+  ]
+};
+
+
+var azHolidayEvents = {
+  id: 3,
+  backgroundColor: '#fbbfdc',
+  borderColor: '#f10075',
+  events: [
+    {
+      id: '10',
+      start: curYear+'-'+curMonth+'-04',
+      end: curYear+'-'+curMonth+'-06',
+      title: 'Feast Day'
+    },
+    {
+      id: '11',
+      start: curYear+'-'+curMonth+'-26',
+      end: curYear+'-'+curMonth+'-27',
+      title: 'Memorial Day'
+    },
+    {
+      id: '12',
+      start: curYear+'-'+curMonth+'-28',
+      end: curYear+'-'+curMonth+'-29',
+      title: 'Veteran\'s Day'
+    }
+  ]
+};
+
+
+var azOtherEvents = {
+  id: 4,
+  backgroundColor: '#ffecca',
+  borderColor: '#ffb52b',
+  events: [
+    {
+      id: '13',
+      start: curYear+'-'+curMonth+'-06',
+      end: curYear+'-'+curMonth+'-08',
+      title: 'My Rest Day'
+    },
+    {
+      id: '13',
+      start: curYear+'-'+curMonth+'-29',
+      end: curYear+'-'+curMonth+'-31',
+      title: 'My Rest Day'
+    }
+  ]
+};

public/assets/js/app-calendar.js

@@ -0,0 +1,205 @@
+$(function(){
+  'use strict'
+
+  // Datepicker found in left sidebar of the page
+  var highlightedDays = ['2018-5-10','2018-5-11','2018-5-12','2018-5-13','2018-5-14','2018-5-15','2018-5-16'];
+  var date = new Date();
+
+  $('.fc-datepicker').datepicker({
+    showOtherMonths: true,
+    selectOtherMonths: true,
+    dateFormat: 'yy-mm-dd',
+    beforeShowDay: function(date) {
+      var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
+      for (var i = 0; i < highlightedDays.length; i++) {
+        if($.inArray(y + '-' + (m+1) + '-' + d,highlightedDays) != -1) {
+          return [true, 'ui-date-highlighted', ''];
+        }
+      }
+      return [true];
+    }
+  });
+
+  var generateTime = function(element) {
+    var n = 0,
+    min = 30,
+    periods = [' AM', ' PM'],
+    times = [],
+    hours = [12, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
+
+    for (var i = 0; i < hours.length; i++) {
+      times.push(hours[i] + ':' + n + n + periods[0]);
+      while (n < 60 - min) {
+        times.push(hours[i] + ':' + ((n += min) < 10 ? 'O' + n : n) + periods[0])
+      }
+      n = 0;
+    }
+
+    times = times.concat(times.slice(0).map(function(time) {
+      return time.replace(periods[0], periods[1])
+    }));
+
+    //console.log(times);
+    $.each(times, function(index, val){
+      $(element).append('<option value="'+val+'">'+val+'</option>');
+    });
+  }
+
+  generateTime('.az-event-time');
+
+  // Initialize fullCalendar
+  $('#calendar').fullCalendar({
+    header: {
+      left: 'prev,next today',
+      center: 'title',
+      right: 'month,agendaWeek,agendaDay,listWeek'
+    },
+    navLinks: true,
+    selectable: true,
+    selectLongPressDelay: 100,
+    editable: true,
+    nowIndicator: true,
+    defaultView: 'listMonth',
+    views: {
+      agenda: {
+        columnHeaderHtml: function(mom) {
+          return '<span>' + mom.format('ddd') + '</span>' +
+                 '<span>' + mom.format('DD') + '</span>';
+        }
+      },
+      day: { columnHeader: false },
+      listMonth: {
+        listDayFormat: 'ddd DD',
+        listDayAltFormat: false
+      },
+      listWeek: {
+        listDayFormat: 'ddd DD',
+        listDayAltFormat: false
+      },
+      agendaThreeDay: {
+        type: 'agenda',
+        duration: { days: 3 },
+        titleFormat: 'MMMM YYYY'
+      }
+    },
+    eventSources: [azCalendarEvents, azBirthdayEvents, azHolidayEvents, azOtherEvents],
+    eventAfterAllRender: function(view) {
+      if(view.name === 'listMonth' || view.name === 'listWeek') {
+        var dates = view.el.find('.fc-list-heading-main');
+        dates.each(function(){
+          var text = $(this).text().split(' ');
+          var now = moment().format('DD');
+
+          $(this).html(text[0]+'<span>'+text[1]+'</span>');
+          if(now === text[1]) { $(this).addClass('now'); }
+        });
+      }
+
+      console.log(view.el);
+    },
+    eventRender: function(event, element) {
+
+      if(event.description) {
+        element.find('.fc-list-item-title').append('<span class="fc-desc">' + event.description + '</span>');
+        element.find('.fc-content').append('<span class="fc-desc">' + event.description + '</span>');
+      }
+
+      var eBorderColor = (event.source.borderColor)? event.source.borderColor : event.borderColor;
+      element.find('.fc-list-item-time').css({
+        color: eBorderColor,
+        borderColor: eBorderColor
+      });
+
+      element.find('.fc-list-item-title').css({
+        borderColor: eBorderColor
+      });
+
+      element.css('borderLeftColor', eBorderColor);
+    },
+  });
+
+  var azCalendar = $('#calendar').fullCalendar('getCalendar');
+
+  // change view to week when in tablet
+  if(window.matchMedia('(min-width: 576px)').matches) {
+    azCalendar.changeView('agendaWeek');
+  }
+
+  // change view to month when in desktop
+  if(window.matchMedia('(min-width: 992px)').matches) {
+    azCalendar.changeView('month');
+  }
+
+  // change view based in viewport width when resize is detected
+  azCalendar.option('windowResize', function(view) {
+    if(view.name === 'listWeek') {
+      if(window.matchMedia('(min-width: 992px)').matches) {
+        azCalendar.changeView('month');
+      } else {
+        azCalendar.changeView('listWeek');
+      }
+    }
+  });
+
+  // display current date
+  var azDateNow = azCalendar.getDate();
+  azCalendar.option('select', function(startDate, endDate){
+    $('#modalSetSchedule').modal('show');
+    $('#azEventStartDate').val(startDate.format('LL'));
+    $('#azEventEndDate').val(endDate.format('LL'));
+
+    $('#azEventStartTime').val(startDate.format('LT')).trigger('change');
+    $('#azEventEndTime').val(endDate.format('LT')).trigger('change');
+  });
+
+  // Display calendar event modal
+  azCalendar.on('eventClick', function(calEvent, jsEvent, view){
+
+    var modal = $('#modalCalendarEvent');
+
+    modal.modal('show');
+    modal.find('.event-title').text(calEvent.title);
+
+    if(calEvent.description) {
+      modal.find('.event-desc').text(calEvent.description);
+      modal.find('.event-desc').prev().removeClass('d-none');
+    } else {
+      modal.find('.event-desc').text('');
+      modal.find('.event-desc').prev().addClass('d-none');
+    }
+
+    modal.find('.event-start-date').text(moment(calEvent.start).format('LLL'));
+    modal.find('.event-end-date').text(moment(calEvent.end).format('LLL'));
+
+    //styling
+    modal.find('.modal-header').css('backgroundColor', (calEvent.source.borderColor)? calEvent.source.borderColor : calEvent.borderColor);
+  });
+
+  // Enable/disable calendar events from displaying in calendar
+  $('.az-nav-calendar-event a').on('click', function(e){
+    e.preventDefault();
+    if($(this).hasClass('exclude')) {
+      $(this).removeClass('exclude');
+
+      $(this).is(':first-child')? azCalendar.addEventSource(azCalendarEvents) : '';
+      $(this).is(':nth-child(2)')? azCalendar.addEventSource(azBirthdayEvents) : '';
+      $(this).is(':nth-child(3)')? azCalendar.addEventSource(azHolidayEvents) : '';
+      $(this).is(':nth-child(4)')? azCalendar.addEventSource(azOtherEvents) : '';
+
+    } else {
+      $(this).addClass('exclude');
+
+      $(this).is(':first-child')? azCalendar.removeEventSource(1) : '';
+      $(this).is(':nth-child(2)')? azCalendar.removeEventSource(2) : '';
+      $(this).is(':nth-child(3)')? azCalendar.removeEventSource(3) : '';
+      $(this).is(':nth-child(4)')? azCalendar.removeEventSource(4) : '';
+    }
+
+    azCalendar.render();
+
+    if(window.matchMedia('(max-width: 575px)').matches) {
+      $('body').removeClass('az-content-left-show');
+    }
+  });
+
+})

public/assets/js/azia.js

@@ -0,0 +1,121 @@
+$(function(){
+  'use strict'
+
+  // This template is mobile first so active menu in navbar
+  // has submenu displayed by default but not in desktop
+  // so the code below will hide the active menu if it's in desktop
+  if(window.matchMedia('(min-width: 992px)').matches) {
+    $('.az-navbar .active').removeClass('show');
+    $('.az-header-menu .active').removeClass('show');
+  }
+
+  // Shows header dropdown while hiding others
+  $('.az-header .dropdown > a').on('click', function(e) {
+    e.preventDefault();
+    $(this).parent().toggleClass('show');
+    $(this).parent().siblings().removeClass('show');
+  });
+
+  // Showing submenu in navbar while hiding previous open submenu
+  $('.az-navbar .with-sub').on('click', function(e) {
+    e.preventDefault();
+    $(this).parent().toggleClass('show');
+    $(this).parent().siblings().removeClass('show');
+  });
+
+  // this will hide dropdown menu from open in mobile
+  $('.dropdown-menu .az-header-arrow').on('click', function(e){
+    e.preventDefault();
+    $(this).closest('.dropdown').removeClass('show');
+  });
+
+  // this will show navbar in left for mobile only
+  $('#azNavShow, #azNavbarShow').on('click', function(e){
+    e.preventDefault();
+    $('body').addClass('az-navbar-show');
+  });
+
+  // this will hide currently open content of page
+  // only works for mobile
+  $('#azContentLeftShow').on('click touch', function(e){
+    e.preventDefault();
+    $('body').addClass('az-content-left-show');
+  });
+
+  // This will hide left content from showing up in mobile only
+  $('#azContentLeftHide').on('click touch', function(e){
+    e.preventDefault();
+    $('body').removeClass('az-content-left-show');
+  });
+
+  // this will hide content body from showing up in mobile only
+  $('#azContentBodyHide').on('click touch', function(e){
+    e.preventDefault();
+    $('body').removeClass('az-content-body-show');
+  })
+
+  // navbar backdrop for mobile only
+  $('body').append('<div class="az-navbar-backdrop"></div>');
+  $('.az-navbar-backdrop').on('click touchstart', function(){
+    $('body').removeClass('az-navbar-show');
+  });
+
+  // Close dropdown menu of header menu
+  $(document).on('click touchstart', function(e){
+    e.stopPropagation();
+
+    // closing of dropdown menu in header when clicking outside of it
+    var dropTarg = $(e.target).closest('.az-header .dropdown').length;
+    if(!dropTarg) {
+      $('.az-header .dropdown').removeClass('show');
+    }
+
+    // closing nav sub menu of header when clicking outside of it
+    if(window.matchMedia('(min-width: 992px)').matches) {
+
+      // Navbar
+      var navTarg = $(e.target).closest('.az-navbar .nav-item').length;
+      if(!navTarg) {
+        $('.az-navbar .show').removeClass('show');
+      }
+
+      // Header Menu
+      var menuTarg = $(e.target).closest('.az-header-menu .nav-item').length;
+      if(!menuTarg) {
+        $('.az-header-menu .show').removeClass('show');
+      }
+
+      if($(e.target).hasClass('az-menu-sub-mega')) {
+        $('.az-header-menu .show').removeClass('show');
+      }
+
+    } else {
+
+      //
+      if(!$(e.target).closest('#azMenuShow').length) {
+        var hm = $(e.target).closest('.az-header-menu').length;
+        if(!hm) {
+          $('body').removeClass('az-header-menu-show');
+        }
+      }
+    }
+
+  });
+
+  $('#azMenuShow').on('click', function(e){
+    e.preventDefault();
+    $('body').toggleClass('az-header-menu-show');
+  })
+
+  $('.az-header-menu .with-sub').on('click', function(e){
+    e.preventDefault();
+    $(this).parent().toggleClass('show');
+    $(this).parent().siblings().removeClass('show');
+  })
+
+  $('.az-header-menu-header .close').on('click', function(e){
+    e.preventDefault();
+    $('body').removeClass('az-header-menu-show');
+  })
+
+});

public/assets/js/chart.chartjs.js

@@ -0,0 +1,437 @@
+$(function(){
+  'use strict';
+
+  var ctx1 = document.getElementById('chartBar1').getContext('2d');
+  new Chart(ctx1, {
+    type: 'bar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        label: '# of Votes',
+        data: [12, 39, 20, 10, 25, 18],
+        backgroundColor: '#560bd0'
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      responsive: true,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          barPercentage: 0.6,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  var ctx2 = document.getElementById('chartBar2').getContext('2d');
+  new Chart(ctx2, {
+    type: 'bar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        label: '# of Votes',
+        data: [12, 39, 20, 10, 25, 18],
+        backgroundColor: 'rgba(0,123,255,.5)'
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      responsive: true,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          barPercentage: 0.6,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  var ctx3 = document.getElementById('chartBar3').getContext('2d');
+
+  var gradient = ctx3.createLinearGradient(0, 0, 0, 250);
+  gradient.addColorStop(0, '#560bd0');
+  gradient.addColorStop(1, '#00cccc');
+
+  new Chart(ctx3, {
+    type: 'bar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        label: '# of Votes',
+        data: [12, 39, 20, 10, 25, 18],
+        backgroundColor: gradient
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      responsive: true,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          barPercentage: 0.6,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  var ctx4 = document.getElementById('chartBar4').getContext('2d');
+  new Chart(ctx4, {
+    type: 'horizontalBar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        label: '# of Votes',
+        data: [12, 39, 20, 10, 25, 18],
+        backgroundColor: ['#560bd0', '#007bff','#00cccc','#cbe0e3','#74de00','#f10075']
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+          }
+        }],
+        xAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11,
+            max: 80
+          }
+        }]
+      }
+    }
+  });
+
+  var ctx5 = document.getElementById('chartBar5').getContext('2d');
+  new Chart(ctx5, {
+    type: 'horizontalBar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        data: [12, 39, 20, 10, 25, 18],
+        backgroundColor: ['#560bd0', '#007bff','#74de00','#f10075','#74de00','#f10075']
+      }, {
+        data: [22, 30, 25, 30, 20, 40],
+        backgroundColor: '#cad0e8'
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11,
+          }
+        }],
+        xAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11,
+            max: 80
+          }
+        }]
+      }
+    }
+  });
+
+  /** STACKED BAR CHART **/
+  var ctx6 = document.getElementById('chartStacked1');
+  new Chart(ctx6, {
+    type: 'bar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        data: [10, 24, 20, 25, 35, 50],
+        backgroundColor: '#314d83',
+        borderWidth: 1,
+        fill: true
+      },{
+        data: [10, 24, 20, 25, 35, 50],
+        backgroundColor: '#007bff',
+        borderWidth: 1,
+        fill: true
+      },{
+        data: [20, 30, 28, 33, 45, 65],
+        backgroundColor: '#cad0e8',
+        borderWidth: 1,
+        fill: true
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          stacked: true,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }],
+        xAxes: [{
+          barPercentage: 0.5,
+          stacked: true,
+          ticks: {
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  var ctx7 = document.getElementById('chartStacked2');
+  new Chart(ctx7, {
+    type: 'horizontalBar',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
+      datasets: [{
+        data: [10, 24, 20, 25, 35, 50],
+        backgroundColor: '#314d83',
+        borderWidth: 1,
+        fill: true
+      },{
+        data: [10, 24, 20, 25, 35, 50],
+        backgroundColor: '#007bff',
+        borderWidth: 1,
+        fill: true
+      },{
+        data: [20, 30, 28, 33, 45, 65],
+        backgroundColor: '#cad0e8',
+        borderWidth: 1,
+        fill: true
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          stacked: true,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          stacked: true,
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  /* LINE CHART */
+  var ctx8 = document.getElementById('chartLine1');
+  new Chart(ctx8, {
+    type: 'line',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+      datasets: [{
+        data: [12, 15, 18, 40, 35, 38, 32, 20, 25, 15, 25, 30],
+        borderColor: '#f10075',
+        borderWidth: 1,
+        fill: false
+      },{
+        data: [10, 20, 25, 55, 50, 45, 35, 30, 45, 35, 55, 40],
+        borderColor: '#007bff',
+        borderWidth: 1,
+        fill: false
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  /** AREA CHART **/
+  var ctx9 = document.getElementById('chartArea1');
+
+  var gradient1 = ctx3.createLinearGradient(0, 350, 0, 0);
+  gradient1.addColorStop(0, 'rgba(241,0,117,0)');
+  gradient1.addColorStop(1, 'rgba(241,0,117,.5)');
+
+  var gradient2 = ctx3.createLinearGradient(0, 280, 0, 0);
+  gradient2.addColorStop(0, 'rgba(0,123,255,0)');
+  gradient2.addColorStop(1, 'rgba(0,123,255,.3)');
+
+  new Chart(ctx9, {
+    type: 'line',
+    data: {
+      labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+      datasets: [{
+        data: [12, 15, 18, 40, 35, 38, 32, 20, 25, 15, 25, 30],
+        borderColor: '#f10075',
+        borderWidth: 1,
+        backgroundColor: gradient1
+      },{
+        data: [10, 20, 25, 55, 50, 45, 35, 37, 45, 35, 55, 40],
+        borderColor: '#007bff',
+        borderWidth: 1,
+        backgroundColor: gradient2
+      }]
+    },
+    options: {
+      maintainAspectRatio: false,
+      legend: {
+        display: false,
+          labels: {
+            display: false
+          }
+      },
+      scales: {
+        yAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 10,
+            max: 80
+          }
+        }],
+        xAxes: [{
+          ticks: {
+            beginAtZero:true,
+            fontSize: 11
+          }
+        }]
+      }
+    }
+  });
+
+  /** PIE CHART **/
+  var datapie = {
+    labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May'],
+    datasets: [{
+      data: [20,20,30,5,25],
+      backgroundColor: ['#560bd0', '#007bff','#00cccc','#cbe0e3','#74de00']
+    }]
+  };
+
+  var optionpie = {
+    maintainAspectRatio: false,
+    responsive: true,
+    legend: {
+      display: false,
+    },
+    animation: {
+      animateScale: true,
+      animateRotate: true
+    }
+  };
+
+  // For a doughnut chart
+  var ctx6 = document.getElementById('chartPie');
+  var myPieChart6 = new Chart(ctx6, {
+    type: 'doughnut',
+    data: datapie,
+    options: optionpie
+  });
+
+  // For a pie chart
+  var ctx7 = document.getElementById('chartDonut');
+  var myPieChart7 = new Chart(ctx7, {
+    type: 'pie',
+    data: datapie,
+    options: optionpie
+  });
+
+
+});

public/assets/js/chart.flot.js

@@ -0,0 +1,339 @@
+$(function() {
+  'use strict';
+
+  $.plot('#flotBar1', [{
+    data: [[0, 3], [1, 8], [2, 5], [3, 13],[4,5], [5,7],[6,4], [7,6], [8,3], [9,7]]
+  }], {
+    series: {
+      bars: {
+        show: true,
+        lineWidth: 0,
+        fillColor: '#b3c4cc',
+        barWidth: .5
+      },
+      highlightColor: '#007bff'
+    },
+    grid: {
+      borderWidth: 1,
+      borderColor: '#e5e5e5',
+      hoverable: true
+    },
+    yaxis: {
+      tickColor: '#d9d9d9',
+      font: {
+        color: '#5f6d7a',
+        size: 10
+      }
+    },
+    xaxis: {
+      tickColor: '#d9d9d9',
+      font: {
+        color: '#5f6d7a',
+        size: 10
+      }
+    }
+  });
+
+  $.plot('#flotBar2', [{
+    data: [[0, 3], [2, 8], [4, 5], [6, 13],[8,5], [10,7],[12,8], [14,10]],
+    bars: {
+      show: true,
+      lineWidth: 0,
+      fillColor: '#007bff',
+      barWidth: .8
+    }
+  },{
+    data: [[1, 5], [3, 7], [5, 10], [7, 7],[9,9], [11,5],[13,4], [15,6]],
+    bars: {
+      show: true,
+      lineWidth: 0,
+      fillColor: '#aab7db',
+      barWidth: .8
+    }
+  }], {
+    grid: {
+      borderWidth: 1,
+      borderColor: '#D9D9D9'
+    },
+    yaxis: {
+      tickColor: '#d9d9d9',
+      font: {
+        color: '#666',
+        size: 10
+      }
+    },
+    xaxis: {
+      tickColor: '#d9d9d9',
+      font: {
+        color: '#666',
+        size: 10
+      }
+    }
+  });
+
+  var newCust = [[0, 2], [1, 3], [2,6], [3, 5], [4, 7], [5, 8], [6, 10]];
+  var retCust = [[0, 1], [1, 2], [2,5], [3, 3], [4, 5], [5, 6], [6,9]];
+
+  var plot = $.plot($('#flotLine1'),[
+    {
+      data: newCust,
+      label: 'New Customer',
+      color: '#007bff'
+    },
+    {
+      data: retCust,
+      label: 'Returning Customer',
+      color: '#f10075'
+    }],
+    {
+      series: {
+        lines: {
+          show: true,
+          lineWidth: 2
+        },
+        shadowSize: 0
+      },
+      points: {
+        show: false,
+      },
+      legend: {
+        noColumns: 1,
+        position: 'nw'
+      },
+      grid: {
+        hoverable: true,
+        clickable: true,
+        borderWidth: 0,
+        labelMargin: 5
+      },
+      yaxis: {
+        min: 0,
+        max: 15,
+        color: '#eee',
+        font: {
+          size: 10,
+          color: '#999'
+        }
+      },
+      xaxis: {
+        color: '#eee',
+        font: {
+          size: 10,
+          color: '#999'
+        }
+      }
+    });
+
+    var plot = $.plot($('#flotLine2'),[
+      {
+        data: newCust,
+        label: 'New Customer',
+        color: '#560bd0'
+      },
+      {
+        data: retCust,
+        label: 'Returning Customer',
+        color: '#85d00b'
+      }],
+      {
+        series: {
+          lines: {
+            show: true,
+            lineWidth: 2
+          },
+          shadowSize: 0
+        },
+        points: {
+          show: true,
+        },
+        legend: {
+          noColumns: 1,
+          position: 'ne'
+        },
+        grid: {
+          hoverable: true,
+          clickable: true,
+          borderColor: '#ddd',
+          borderWidth: 0,
+          labelMargin: 5
+        },
+        yaxis: {
+          min: 0,
+          max: 15,
+          color: '#eee',
+          font: {
+            size: 10,
+            color: '#999'
+          }
+        },
+        xaxis: {
+          color: '#eee',
+          font: {
+            size: 10,
+            color: '#999'
+          }
+        }
+      });
+
+
+
+      var plot = $.plot($('#flotArea1'),[
+        {
+          data: newCust,
+          label: 'New Customer',
+          color: '#f10075'
+        },
+        {
+          data: retCust,
+          label: 'Returning Customer',
+          color: '#007bff'
+        }],
+        {
+          series: {
+            lines: {
+              show: true,
+              lineWidth: 1,
+              fill: true,
+              fillColor: { colors: [ { opacity: 0 }, { opacity: 0.8 } ] }
+            },
+            shadowSize: 0
+          },
+          points: {
+            show: false,
+          },
+          legend: {
+            noColumns: 1,
+            position: 'nw'
+          },
+          grid: {
+            hoverable: true,
+            clickable: true,
+            borderColor: '#ddd',
+            borderWidth: 0,
+            labelMargin: 5
+          },
+          yaxis: {
+            min: 0,
+            max: 15,
+            color: '#eee',
+            font: {
+              size: 10,
+              color: '#999'
+            }
+          },
+          xaxis: {
+            color: '#eee',
+            font: {
+              size: 10,
+              color: '#999'
+            }
+          }
+        });
+
+        var plot = $.plot($('#flotArea2'),[
+          {
+            data: newCust,
+            label: 'New Customer',
+            color: '#85d00b'
+          },
+          {
+            data: retCust,
+            label: 'Returning Customer',
+            color: '#560bd0'
+          }],
+          {
+            series: {
+              lines: {
+                show: true,
+                lineWidth: 1,
+                fill: true,
+                fillColor: { colors: [ { opacity: 0 }, { opacity: 0.3 } ] }
+              },
+              shadowSize: 0
+            },
+            points: {
+              show: true,
+            },
+            legend: {
+              noColumns: 1,
+              position: 'nw'
+            },
+            grid: {
+              hoverable: true,
+              clickable: true,
+              borderColor: '#ddd',
+              borderWidth: 0,
+              labelMargin: 5
+            },
+            yaxis: {
+              min: 0,
+              max: 15,
+              color: '#eee',
+              font: {
+                size: 10,
+                color: '#999'
+              }
+            },
+            xaxis: {
+              color: '#eee',
+              font: {
+                size: 10,
+                color: '#999'
+              }
+            }
+          });
+
+
+          /**************** PIE CHART *******************/
+          var piedata = [
+            { label: 'Series 1', data: [[1,10]], color: '#6610f2'},
+            { label: 'Series 2', data: [[1,30]], color: '#007bff'},
+            { label: 'Series 3', data: [[1,90]], color: '#85d00b'},
+            { label: 'Series 4', data: [[1,70]], color: '#00cccc'},
+            { label: 'Series 5', data: [[1,80]], color: '#494c57'}
+          ];
+
+          $.plot('#flotPie1', piedata, {
+            series: {
+              pie: {
+                show: true,
+                radius: 1,
+                label: {
+                  show: true,
+                  radius: 2/3,
+                  formatter: labelFormatter,
+                  threshold: 0.1
+                }
+              }
+            },
+            grid: {
+              hoverable: true,
+              clickable: true
+            }
+          });
+
+          $.plot('#flotPie2', piedata, {
+            series: {
+              pie: {
+                show: true,
+                radius: 1,
+                innerRadius: 0.5,
+                label: {
+                  show: true,
+                  radius: 2/3,
+                  formatter: labelFormatter,
+                  threshold: 0.1
+                }
+              }
+            },
+            grid: {
+              hoverable: true,
+              clickable: true
+            }
+          });
+
+          function labelFormatter(label, series) {
+            return '<div style="font-size:8pt; text-align:center; padding:2px; color:white;">' + label + '<br/>' + Math.round(series.percent) + '%</div>';
+          }
+
+        });

public/assets/js/chart.morris.js

@@ -0,0 +1,188 @@
+$(function(){
+  'use strict';
+
+  var morrisData = [
+    { y: '2006', a: 100, b: 90 },
+    { y: '2007', a: 75,  b: 65 },
+    { y: '2008', a: 50,  b: 40 },
+    { y: '2009', a: 75,  b: 65 },
+    { y: '2010', a: 50,  b: 40 },
+    { y: '2011', a: 80, b: 90 },
+    { y: '2012', a: 75,  b: 65 },
+    { y: '2013', a: 50,  b: 70 }
+  ];
+
+  var morrisData2 = [
+    { y: '2006', a: 100, b: 90, c: 80 },
+    { y: '2007', a: 75,  b: 65, c: 75 },
+    { y: '2008', a: 50,  b: 40, c: 45 },
+    { y: '2009', a: 75,  b: 65, c: 85 },
+    { y: '2010', a: 100, b: 90, c: 80 },
+    { y: '2011', a: 75,  b: 65, c: 75 },
+    { y: '2012', a: 50,  b: 40, c: 45 },
+    { y: '2013', a: 75,  b: 65, c: 85 }
+  ];
+
+  new Morris.Bar({
+    element: 'morrisBar1',
+    data: morrisData,
+    xkey: 'y',
+    ykeys: ['a', 'b'],
+    labels: ['Series A', 'Series B'],
+    barColors: ['#560bd0', '#007bff'],
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Bar({
+    element: 'morrisBar2',
+    data: morrisData2,
+    xkey: 'y',
+    ykeys: ['a', 'b', 'c'],
+    labels: ['Series A', 'Series B', 'Series C'],
+    barColors: ['#560bd0', '#007bff','#00cccc'],
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Bar({
+    element: 'morrisBar3',
+    data: morrisData,
+    xkey: 'y',
+    ykeys: ['a', 'b'],
+    labels: ['Series A', 'Series B'],
+    barColors: ['#560bd0', '#007bff'],
+    stacked: true,
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Bar({
+    element: 'morrisBar4',
+    data: morrisData2,
+    xkey: 'y',
+    ykeys: ['a', 'b', 'c'],
+    labels: ['Series A', 'Series B', 'Series C'],
+    barColors: ['#560bd0', '#007bff','#00cccc'],
+    stacked: true,
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+
+  new Morris.Line({
+    element: 'morrisLine1',
+    data: [
+      { y: '2006', a: 20, b: 10 },
+      { y: '2007', a: 30,  b: 15 },
+      { y: '2008', a: 60,  b: 40 },
+      { y: '2009', a: 40,  b: 25 },
+      { y: '2010', a: 30,  b: 15 },
+      { y: '2011', a: 45,  b: 20 },
+      { y: '2012', a: 60, b: 40 }
+    ],
+    xkey: 'y',
+    ykeys: ['a', 'b'],
+    labels: ['Series A', 'Series B'],
+    lineColors: ['#560bd0', '#007bff'],
+    lineWidth: 1,
+    ymax: 'auto 100',
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Line({
+    element: 'morrisLine2',
+    data: [
+      { y: '2006', a: 20, b: 10, c: 40 },
+      { y: '2007', a: 30, b: 15, c: 45 },
+      { y: '2008', a: 50, b: 40, c: 65 },
+      { y: '2009', a: 40, b: 25, c: 55 },
+      { y: '2010', a: 30, b: 15, c: 45 },
+      { y: '2011', a: 45, b: 20, c: 65 },
+      { y: '2012', a: 60, b: 40, c: 70 }
+    ],
+    xkey: 'y',
+    ykeys: ['a', 'b', 'c'],
+    labels: ['Series A', 'Series B', 'Series C'],
+    lineColors: ['#560bd0', '#007bff','#00cccc'],
+    lineWidth: 1,
+    ymax: 'auto 100',
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Area({
+    element: 'morrisArea1',
+    data: [
+      { y: '2006', a: 50, b: 40 },
+      { y: '2007', a: 25,  b: 15 },
+      { y: '2008', a: 20,  b: 40 },
+      { y: '2009', a: 75,  b: 65 },
+      { y: '2010', a: 50,  b: 40 },
+      { y: '2011', a: 75,  b: 65 },
+      { y: '2012', a: 100, b: 90 }
+    ],
+    xkey: 'y',
+    ykeys: ['a', 'b'],
+    labels: ['Series A', 'Series B'],
+    lineColors: ['#560bd0', '#007bff'],
+    lineWidth: 1,
+    fillOpacity: 0.9,
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Area({
+    element: 'morrisArea2',
+    data: [
+      { y: '2006', a: 20, b: 10, c: 40 },
+      { y: '2007', a: 30, b: 15, c: 45 },
+      { y: '2008', a: 50, b: 40, c: 65 },
+      { y: '2009', a: 40, b: 25, c: 55 },
+      { y: '2010', a: 30, b: 15, c: 45 },
+      { y: '2011', a: 45, b: 20, c: 65 },
+      { y: '2012', a: 60, b: 40, c: 70 }
+    ],
+    xkey: 'y',
+    ykeys: ['a', 'b', 'c'],
+    labels: ['Series A', 'Series B', 'Series C'],
+    lineColors: ['#560bd0', '#007bff','#00cccc'],
+    lineWidth: 1,
+    fillOpacity: 0.9,
+    gridTextSize: 11,
+    hideHover: 'auto',
+    resize: true
+  });
+
+  new Morris.Donut({
+    element: 'morrisDonut1',
+    data: [
+      {label: 'Men', value: 12},
+      {label: 'Women', value: 30},
+      {label: 'Kids', value: 20}
+    ],
+    colors: ['#560bd0', '#007bff','#00cccc'],
+    resize: true
+  });
+
+  new Morris.Donut({
+    element: 'morrisDonut2',
+    data: [
+      {label: 'Men', value: 12},
+      {label: 'Women', value: 30},
+      {label: 'Kids', value: 20},
+      {label: 'Infant', value: 25}
+    ],
+    colors: ['#560bd0', '#007bff','#00cccc','#74DE00'],
+    resize: true,
+  });
+
+});

public/assets/js/chart.peity.js

@@ -0,0 +1,17 @@
+$(function(){
+  'use strict'
+
+  // Line chart
+  $('.peity-line').peity('line');
+
+  // Bar charts
+  $('.peity-bar').peity('bar');
+
+  // Pie chart
+  $('.peity-pie').peity('pie');
+
+  // Donut chart
+  $('.peity-donut').peity('donut');
+
+  // Bar chart is already initialized found in bracket.js
+});

public/assets/js/chart.sparkline.js

@@ -0,0 +1,108 @@
+$(function(){
+  'use strict'
+
+  /***************** LINE CHARTS *****************/
+  $('#sparkline1').sparkline('html', {
+    width: 200,
+    height: 70,
+    lineColor: '#0083CD',
+    fillColor: false,
+    tooltipContainer: $('.az-content')
+  });
+
+  $('#sparkline2').sparkline('html', {
+    width: 200,
+    height: 70,
+    lineColor: '#B654C3',
+    fillColor: false
+  });
+
+
+  /************** AREA CHARTS ********************/
+  $('#sparkline3').sparkline('html', {
+    width: 200,
+    height: 70,
+    lineColor: '#0083CD',
+    fillColor: 'rgba(0,131,205,0.2)',
+  });
+
+  $('#sparkline4').sparkline('html', {
+    width: 200,
+    height: 70,
+    lineColor: '#B654C3',
+    fillColor: 'rgba(182,84,195,0.2)'
+  });
+
+
+  /******************* BAR CHARTS *****************/
+
+  $('#sparkline5').sparkline('html', {
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#560bd0',
+    chartRangeMax: 12
+  });
+
+  $('#sparkline6').sparkline('html', {
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#007bff',
+    chartRangeMax: 12
+  });
+
+  /***************** STACKED BAR CHARTS ****************/
+
+  $('#sparkline7').sparkline('html', {
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#007bff',
+    chartRangeMax: 12
+  });
+
+  $('#sparkline7').sparkline([4,5,6,7,4,5,8,7,6,6,4,7,6,4,7], {
+    composite: true,
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#560bd0',
+    chartRangeMax: 12
+  });
+
+  $('#sparkline8').sparkline('html', {
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#007bff',
+    chartRangeMax: 12
+  });
+
+  $('#sparkline8').sparkline([4,5,6,7,4,5,8,7,6,6,4,7,6,4,7], {
+    composite: true,
+    type: 'bar',
+    barWidth: 10,
+    height: 70,
+    barColor: '#f10075',
+    chartRangeMax: 12
+  });
+
+
+  /**************** PIE CHART ****************/
+
+  $('#sparkline9').sparkline('html', {
+    type: 'pie',
+    width: 70,
+    height: 70,
+    sliceColors: ['#560bd0','#007bff','#00cccc']
+  });
+
+  $('#sparkline10').sparkline('html', {
+    type: 'pie',
+    width: 70,
+    height: 70,
+    sliceColors: ['#560bd0','#007bff','#00cccc','#f10075','#74de00','#494c57']
+  });
+
+});

public/assets/js/cookie.js

@@ -0,0 +1,27 @@
+
+'use strict';
+
+function setCookie(name,value,days) {
+  var expires = '';
+  if (days) {
+    var date = new Date();
+    date.setTime(date.getTime() + (days*24*60*60*1000));
+    expires = '; expires=' + date.toUTCString();
+  }
+  document.cookie = name + '=' + (value || '')  + expires + '; path=/';
+}
+
+function getCookie(name) {
+  var nameEQ = name + '=';
+  var ca = document.cookie.split(';');
+  for(var i=0;i < ca.length;i++) {
+    var c = ca[i];
+    while (c.charAt(0)==' ') c = c.substring(1,c.length);
+    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
+  }
+  return false;
+}
+
+function eraseCookie(name) {
+  document.cookie = name+'=; Max-Age=-99999999;';
+}

public/assets/js/dashboard.sampledata.js

@@ -0,0 +1,666 @@
+'use strict'
+
+var dashData1 = [
+  [0,26.068193382661477],
+  [1,25.88709150935915],
+  [2,28.928221477526932],
+  [3,24.830795658318337],
+  [4,24.85092974219436],
+  [5,22.774591414051095],
+  [6,22.747896818655654],
+  [7,18.048114046063965],
+  [8,17.59073050876624],
+  [9,21.537818914461322],
+  [10,22.146436551824877],
+  [11,20.300838613022865],
+  [12,16.735032698267464],
+  [13,12.413872176047448],
+  [14,13.519219684546744],
+  [15,17.25809280186558],
+  [16,12.862483806544592],
+  [17,8.80788649085728],
+  [18,5.658660000939715],
+  [19,8.99589358930801],
+  [20,5.269093761151957],
+  [21,8.912177863786797],
+  [22,8.54011774798965],
+  [23,9.117679467731724],
+  [24,13.699940679394622],
+  [25,11.627299181374358],
+  [26,6.838737088173566],
+  [27,6.160480751363494],
+  [28,5.5198301136747006],
+  [29,4.613458911330751],
+  [30,3.383144691141741],
+  [31,5.784322300404977],
+  [32,3.162177027129866],
+  [33,0.4181156533246826],
+  [34,4.421765491030399],
+  [35,0.8094224158158259],
+  [36,9.413220194935048],
+  [37,8.496612114320378],
+  [38,12.738123867101411],
+  [39,16.992766477187104],
+  [40,21.26988175109983],
+  [41,17.235980511632608],
+  [42,20.443384061578378],
+  [43,16.44487173159613],
+  [44,15.007678605580637],
+  [45,19.988715632633586],
+  [46,21.321036609595225],
+  [47,17.824308266337006],
+  [48,16.4065339731343],
+  [49,19.39209608662649],
+  [50,15.239194559890223],
+  [51,13.389321128669074],
+  [52,12.09037154870833],
+  [53,8.20591186418305],
+  [54,12.313286201963933],
+  [55,11.933214675329545],
+  [56,15.633264981180222],
+  [57,13.587849610586343],
+  [58,9.376742478047557],
+  [59,4.441641823689398],
+  [60,4.162445655270751],
+  [61,8.581262486880055],
+  [62,5.441817659292306],
+  [63,4.446750282572058],
+  [64,4.276872245140725],
+  [65,0.6300340509632116],
+  [66,9.343436375658632],
+  [67,6.515393292394883],
+  [68,2.2640316516849293],
+  [69,6.6366447744180395],
+  [70,6.572503829436759],
+  [71,9.798163928174066],
+  [72,14.718403191204246],
+  [73,13.254699260872222],
+  [74,10.89349088805535],
+  [75,7.6253467930040895],
+  [76,3.3193074854674904],
+  [77,7.08673703515133],
+  [78,3.4528219176441137],
+  [79,0.7645929463547789]
+];
+
+var dashData2 = [
+  [0,27.23664159018842],
+  [1,29.950034069379143],
+  [2,29.644830736016026],
+  [3,25.769612795319304],
+  [4,25.9672980159902],
+  [5,29.306231062193945],
+  [6,31.147632883383046],
+  [7,27.909654447655207],
+  [8,28.426864707429758],
+  [9,25.465005080095395],
+  [10,23.200993777812627],
+  [11,18.298423899495088],
+  [12,14.064190975238525],
+  [13,12.756500849206802],
+  [14,11.009698256259721],
+  [15,13.777021847639084],
+  [16,9.764516822388899],
+  [17,12.692252142103655],
+  [18,10.993546294133743],
+  [19,12.76637263741139],
+  [20,13.843200048454541],
+  [21,12.99710730408541],
+  [22,13.822031388180491],
+  [23,10.292515338153533],
+  [24,5.810285403597657],
+  [25,7.660875205768917],
+  [26,8.80933653938396],
+  [27,5.686812232232839],
+  [28,5.63261704703088],
+  [29,6.316648245814662],
+  [30,4.292790984709081],
+  [31,3.697685557314916],
+  [32,5.455501325916567],
+  [33,6.531394786185377],
+  [34,8.182002901837398],
+  [35,10.97985605046474],
+  [36,7.670515545499569],
+  [37,9.735460695108053],
+  [38,10.953255620842702],
+  [39,9.507118597321119],
+  [40,5.406694867279592],
+  [41,4.93085440378951],
+  [42,0.7194264766862029],
+  [43,2.3619348017672],
+  [44,5.584661939154044],
+  [45,10.081512479626763],
+  [46,10.688764814852894],
+  [47,8.312501373210273],
+  [48,8.453461343329785],
+  [49,8.544757446852685],
+  [50,5.845487925639054],
+  [51,1.5807150114153075],
+  [52,0.563335804242973],
+  [53,4.894286843146261],
+  [54,9.856287534207203],
+  [55,4.896396641974256],
+  [56,1.2942099540425414],
+  [57,5.809421858534812],
+  [58,1.733415110300613],
+  [59,5.460384956746324],
+  [60,5.990998309935479],
+  [61,7.594177171313888],
+  [62,10.660329512374963],
+  [63,5.973124255808589],
+  [64,3.3313399294306265],
+  [65,2.9044866902167623],
+  [66,6.997197180694009],
+  [67,3.523117772813361],
+  [68,0.2391695609805211],
+  [69,7.542664698417907],
+  [70,9.803040324502735],
+  [71,13.065087817954282],
+  [72,13.995144609672131],
+  [73,9.572683988371006],
+  [74,6.262408675238298],
+  [75,6.343448236306536],
+  [76,6.594421915015488],
+  [77,2.2274478023982844],
+  [78,2.917574438953957],
+  [79,6.405517005560797]
+];
+
+var dashData3 = [
+  [0,6.128957947555989],
+  [1,10.84817222898398],
+  [2,10.082875592706364],
+  [3,8.379792694345753],
+  [4,9.547667054986002],
+  [5,4.773069367954017],
+  [6,3.0454348426761015],
+  [7,3.185480541480409],
+  [8,4.450143911018419],
+  [9,8.546949979037999],
+  [10,6.050127209461188],
+  [11,4.410453949908726],
+  [12,2.8471832046168135],
+  [13,3.2079540734030276],
+  [14,0.9162857987827975],
+  [15,4.6063565674411855],
+  [16,3.8108543994622526],
+  [17,0.07206516983173028],
+  [18,2.0235838597966103],
+  [19,3.11038525002839],
+  [20,7.661023220500137],
+  [21,4.392807043336401],
+  [22,2.095095656433122],
+  [23,3.6570708335265856],
+  [24,2.4750755395505095],
+  [25,7.365775338287607],
+  [26,3.160729824900333],
+  [27,5.540806251220914],
+  [28,0.6666892513129863],
+  [29,0.45739329594884204],
+  [30,3.0811785305861257],
+  [31,2.6892574426453804],
+  [32,9.518442007203902],
+  [33,12.031943999285872],
+  [34,16.195611227357478],
+  [35,20.843438986023465],
+  [36,23.379026518714024],
+  [37,21.460750940722328],
+  [38,18.40015951232427],
+  [39,20.358446800608565],
+  [40,19.603101971624245],
+  [41,17.573732753993674],
+  [42,18.335981070943816],
+  [43,18.91414918074011],
+  [44,21.429677122613647],
+  [45,22.632616262811762],
+  [46,25.94041622331629],
+  [47,28.28824125745345],
+  [48,24.435585052120953],
+  [49,19.597224874784906],
+  [50,16.697366660087496],
+  [51,17.2746170933131],
+  [52,19.375521763009953],
+  [53,18.566968104092673],
+  [54,16.44690797028392],
+  [55,20.442159904725813],
+  [56,18.092434838530224],
+  [57,19.09142302964581],
+  [58,20.00188167403888],
+  [59,24.672205627775327],
+  [60,21.740520957489338],
+  [61,26.026676694036176],
+  [62,21.822075708233086],
+  [63,18.695019208154772],
+  [64,15.29250743609338],
+  [65,10.428562033214584],
+  [66,11.55987585035231],
+  [67,14.896344657234035],
+  [68,10.307653031970014],
+  [69,7.82306217533851],
+  [70,10.238887296153184],
+  [71,8.8820687254494],
+  [72,10.100845630385322],
+  [73,9.217362717192456],
+  [74,7.896629068410565],
+  [75,5.618935926339423],
+  [76,1.5131215135592138],
+  [77,0.2784413238662804],
+  [78,0.7433401750417863],
+  [79,5.451097931401492]
+];
+
+var dashData4 = [
+  [0,6.324329988896064],
+  [1,4.5545479994319145],
+  [2,6.100415206277958],
+  [3,7.432637151690175],
+  [4,5.60263986254995],
+  [5,4.832425480686457],
+  [6,0.9075445440427758],
+  [7,3.1482139596880163],
+  [8,3.5885516133784767],
+  [9,8.182754904215557],
+  [10,6.837879179399149],
+  [11,7.716258659531048],
+  [12,9.75364233299447],
+  [13,7.201169154192655],
+  [14,9.630620744220206],
+  [15,11.538477281715668],
+  [16,13.035970513058636],
+  [17,9.503486957660966],
+  [18,13.105314699985755],
+  [19,15.573652620996299],
+  [20,18.36838092867314],
+  [21,19.350295101555055],
+  [22,22.69794643352061],
+  [23,23.35219679846173],
+  [24,20.91736598898101],
+  [25,22.911176901130386],
+  [26,21.090864789052763],
+  [27,20.48061479748539],
+  [28,21.426374503640886],
+  [29,20.891864381778447],
+  [30,16.957950831314058],
+  [31,21.859429734865678],
+  [32,24.445685183180625],
+  [33,21.60020575061327],
+  [34,24.182176166954967],
+  [35,21.86974880152203],
+  [36,19.539183274840212],
+  [37,21.515732665615417],
+  [38,20.24304044649329],
+  [39,21.42144524531482],
+  [40,17.43905530887784],
+  [41,21.32170798934231],
+  [42,23.496165105754205],
+  [43,20.329972299235536],
+  [44,17.810139981879978],
+  [45,13.81114512021962],
+  [46,12.997268524103216],
+  [47,10.799564050000965],
+  [48,12.512143426754726],
+  [49,14.43450958489095],
+  [50,16.307532107912],
+  [51,17.805531426224746],
+  [52,20.335760159301408],
+  [53,17.283957375094232],
+  [54,14.358038015713984],
+  [55,12.244453474656833],
+  [56,14.851550722124355],
+  [57,12.376637218044237],
+  [58,10.410990876698504],
+  [59,14.213384593585047],
+  [60,14.086784566997245],
+  [61,14.958720914431318],
+  [62,17.654154385117913],
+  [63,17.90512378115347],
+  [64,15.51065801821678],
+  [65,13.614902552930381],
+  [66,15.012164925379324],
+  [67,12.526591306146639],
+  [68,12.41629841447126],
+  [69,13.14610812485586],
+  [70,11.99821556340692],
+  [71,7.673455706892817],
+  [72,9.020477318416384],
+  [73,4.883009317288051],
+  [74,8.216160091544365],
+  [75,12.972532341711904],
+  [76,14.900762708964251],
+  [77,16.071024828496675],
+  [78,16.80733921452504],
+  [79,21.50456189793593]
+];
+
+var dashData5 = [
+  [0,0],
+  [1,0],
+  [2,0],
+  [3,0],
+  [4,0],
+  [5,0],
+  [6,0],
+  [7,0],
+  [8,0],
+  [9,0],
+  [10,0],
+  [11,0],
+  [12,0],
+  [13,0],
+  [14,0],
+  [15,0],
+  [16,0],
+  [17,0],
+  [18,0],
+  [19,0],
+  [20,0],
+  [21,0],
+  [22,0],
+  [23,0],
+  [24,0],
+  [25,0],
+  [26,0],
+  [27,0],
+  [28,0],
+  [29,0],
+  [30,0],
+  [31,0],
+  [32,0],
+  [33,0],
+  [34,0],
+  [35,0],
+  [36,0],
+  [37,0],
+  [38,0],
+  [39,0],
+  [40,10],
+  [41,0],
+  [42,0],
+  [43,0],
+  [44,45],
+  [45,0],
+  [46,0],
+  [47,37],
+  [48,0],
+  [49,39],
+  [50,0],
+  [51,0],
+  [52,0],
+  [53,5],
+  [54,0],
+  [55,31],
+  [56,0],
+  [57,43],
+  [58,0],
+  [59,0],
+  [60,30],
+  [61,0],
+  [62,0],
+  [63,0],
+  [64,0],
+  [65,0],
+  [66,0],
+  [67,0],
+  [68,0],
+  [69,0]
+];
+
+var dashData6 = [
+  [0,0],
+  [1,0],
+  [2,0],
+  [3,0],
+  [4,0],
+  [5,0],
+  [6,0],
+  [7,0],
+  [8,0],
+  [9,0],
+  [10,0],
+  [11,40],
+  [12,0],
+  [13,5],
+  [14,0],
+  [15,0],
+  [16,0],
+  [17,0],
+  [18,0],
+  [19,0],
+  [20,0],
+  [21,0],
+  [22,0],
+  [23,0],
+  [24,0],
+  [25,0],
+  [26,0],
+  [27,0],
+  [28,0],
+  [29,0],
+  [30,0],
+  [31,0],
+  [32,0],
+  [33,0],
+  [34,0],
+  [35,0],
+  [36,0],
+  [37,0],
+  [38,0],
+  [39,0],
+  [40,45],
+  [41,1],
+  [42,0],
+  [43,0],
+  [44,35],
+  [45,0],
+  [46,0],
+  [47,40],
+  [48,0],
+  [49,0],
+  [50,45],
+  [51,0],
+  [52,0],
+  [53,0],
+  [54,5],
+  [55,0],
+  [56,0],
+  [57,20],
+  [58,0],
+  [59,5],
+  [60,0],
+  [61,0],
+  [62,0],
+  [63,0],
+  [64,0],
+  [65,0],
+  [66,0],
+  [67,0],
+  [68,0],
+  [69,0]
+];
+
+var dashData7 = [
+  [0,0],
+  [1,0],
+  [2,0],
+  [3,0],
+  [4,0],
+  [5,0],
+  [6,0],
+  [7,0],
+  [8,0],
+  [9,0],
+  [10,0],
+  [11,0],
+  [12,0],
+  [13,0],
+  [14,0],
+  [15,0],
+  [16,0],
+  [17,0],
+  [18,0],
+  [19,0],
+  [20,0],
+  [21,0],
+  [22,0],
+  [23,0],
+  [24,0],
+  [25,40],
+  [26,0],
+  [27,0],
+  [28,10],
+  [29,0],
+  [30,0],
+  [31,0],
+  [32,0],
+  [33,0],
+  [34,0],
+  [35,0],
+  [36,0],
+  [37,0],
+  [38,0],
+  [39,0],
+  [40,50],
+  [41,0],
+  [42,40],
+  [43,0],
+  [44,5],
+  [45,0],
+  [46,0],
+  [47,10],
+  [48,0],
+  [49,0],
+  [50,25],
+  [51,0],
+  [52,0],
+  [53,0],
+  [54,5],
+  [55,0],
+  [56,0],
+  [57,0],
+  [58,0],
+  [59,25],
+  [60,0],
+  [61,0],
+  [62,0],
+  [63,0],
+  [64,40],
+  [65,0],
+  [66,0],
+  [67,0],
+  [68,0],
+  [69,0]
+];
+
+var dashData8 = [
+  [0,0],
+  [1,0],
+  [2,0],
+  [3,5],
+  [4,0],
+  [5,10],
+  [6,15],
+  [7,20],
+  [8,14],
+  [9,20],
+  [10,15],
+  [11,12],
+  [12,15],
+  [13,12],
+  [14,17],
+  [15,15],
+  [16,13],
+  [17,16],
+  [18,0],
+  [19,0],
+  [20,0],
+  [21,0],
+  [22,0],
+  [23,0],
+  [24,0],
+  [25,0],
+  [26,0],
+  [27,0],
+  [28,0],
+  [29,0],
+  [30,0],
+  [31,0],
+  [32,0],
+  [33,0],
+  [34,0],
+  [35,0],
+  [36,0],
+  [37,0],
+  [38,0],
+  [39,0],
+  [40,0],
+  [41,0],
+  [42,0],
+  [43,0],
+  [44,0],
+  [45,0],
+  [46,0],
+  [47,0],
+  [48,0],
+  [49,0]
+];
+
+var dashData9 = [
+  [0,0],
+  [1,0],
+  [2,0],
+  [3,0],
+  [4,0],
+  [5,3],
+  [6,7],
+  [7,12],
+  [8,5],
+  [9,10],
+  [10,14],
+  [11,15],
+  [12,20],
+  [13,15],
+  [14,30],
+  [15,32],
+  [16,28],
+  [17,25],
+  [18,0],
+  [19,0],
+  [20,0],
+  [21,0],
+  [22,0],
+  [23,0],
+  [24,0],
+  [25,0],
+  [26,0],
+  [27,0],
+  [28,0],
+  [29,0],
+  [30,0],
+  [31,0],
+  [32,0],
+  [33,0],
+  [34,0],
+  [35,0],
+  [36,0],
+  [37,0],
+  [38,0],
+  [39,0],
+  [40,0],
+  [41,0],
+  [42,0],
+  [43,0],
+  [44,0],
+  [45,0],
+  [46,0],
+  [47,0],
+  [48,0],
+  [49,0]
+];
+
+function bgFlotData(num,val) {
+  var data = [];
+  for (var i = 0; i < num; ++i) {
+    data.push([i, val]);
+  }
+  return data;
+}

public/assets/js/jquery.vmap.sampledata.js

@@ -0,0 +1,3 @@
+'use strict'
+
+var sample_data = {'af':'16.63','al':'11.58','dz':'158.97','ao':'85.81','ag':'1.1','ar':'351.02','am':'8.83','au':'1219.72','at':'366.26','az':'52.17','bs':'7.54','bh':'21.73','bd':'105.4','bb':'3.96','by':'52.89','be':'461.33','bz':'1.43','bj':'6.49','bt':'1.4','bo':'19.18','ba':'16.2','bw':'12.5','br':'2023.53','bn':'11.96','bg':'44.84','bf':'8.67','bi':'1.47','kh':'11.36','cm':'21.88','ca':'1563.66','cv':'1.57','cf':'2.11','td':'7.59','cl':'199.18','cn':'5745.13','co':'283.11','km':'0.56','cd':'12.6','cg':'11.88','cr':'35.02','ci':'22.38','hr':'59.92','cy':'22.75','cz':'195.23','dk':'304.56','dj':'1.14','dm':'0.38','do':'50.87','ec':'61.49','eg':'216.83','sv':'21.8','gq':'14.55','er':'2.25','ee':'19.22','et':'30.94','fj':'3.15','fi':'231.98','fr':'2555.44','ga':'12.56','gm':'1.04','ge':'11.23','de':'3305.9','gh':'18.06','gr':'305.01','gd':'0.65','gt':'40.77','gn':'4.34','gw':'0.83','gy':'2.2','ht':'6.5','hn':'15.34','hk':'226.49','hu':'132.28','is':'12.77','in':'1430.02','id':'695.06','ir':'337.9','iq':'84.14','ie':'204.14','il':'201.25','it':'2036.69','jm':'13.74','jp':'5390.9','jo':'27.13','kz':'129.76','ke':'32.42','ki':'0.15','kr':'986.26','undefined':'5.73','kw':'117.32','kg':'4.44','la':'6.34','lv':'23.39','lb':'39.15','ls':'1.8','lr':'0.98','ly':'77.91','lt':'35.73','lu':'52.43','mk':'9.58','mg':'8.33','mw':'5.04','my':'218.95','mv':'1.43','ml':'9.08','mt':'7.8','mr':'3.49','mu':'9.43','mx':'1004.04','md':'5.36','mn':'5.81','me':'3.88','ma':'91.7','mz':'10.21','mm':'35.65','na':'11.45','np':'15.11','nl':'770.31','nz':'138','ni':'6.38','ne':'5.6','ng':'206.66','no':'413.51','om':'53.78','pk':'174.79','pa':'27.2','pg':'8.81','py':'17.17','pe':'153.55','ph':'189.06','pl':'438.88','pt':'223.7','qa':'126.52','ro':'158.39','ru':'1476.91','rw':'5.69','ws':'0.55','st':'0.19','sa':'434.44','sn':'12.66','rs':'38.92','sc':'0.92','sl':'1.9','sg':'217.38','sk':'86.26','si':'46.44','sb':'0.67','za':'354.41','es':'1374.78','lk':'48.24','kn':'0.56','lc':'1','vc':'0.58','sd':'65.93','sr':'3.3','sz':'3.17','se':'444.59','ch':'522.44','sy':'59.63','tw':'426.98','tj':'5.58','tz':'22.43','th':'312.61','tl':'0.62','tg':'3.07','to':'0.3','tt':'21.2','tn':'43.86','tr':'729.05','tm':0,'ug':'17.12','ua':'136.56','ae':'239.65','gb':'2258.57','us':'14624.18','uy':'40.71','uz':'37.72','vu':'0.72','ve':'285.21','vn':'101.99','ye':'30.02','zm':'15.69','zw':'5.57'};

public/assets/js/map.apple.js

@@ -0,0 +1,115 @@
+$(function() {
+
+  'use strict';
+
+  var styleApple = [{
+    'featureType': 'landscape.man_made',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#f7f1df'
+    }]
+  }, {
+    'featureType': 'landscape.natural',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#d0e3b4'
+    }]
+  }, {
+    'featureType': 'landscape.natural.terrain',
+    'elementType': 'geometry',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'poi',
+    'elementType': 'labels',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'poi.business',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'poi.medical',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#fbd3da'
+    }]
+  }, {
+    'featureType': 'poi.park',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#bde6ab'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': '#ffe15f'
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'color': '#efd151'
+    }]
+  }, {
+    'featureType': 'road.arterial',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': '#ffffff'
+    }]
+  }, {
+    'featureType': 'road.local',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': 'black'
+    }]
+  }, {
+    'featureType': 'transit.station.airport',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': '#cfb2db'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#a2daf2'
+    }]
+  }];
+
+  var mapApple = new GMaps({
+    el: '#mapApple',
+    zoom: 14,
+    lat: 40.702247,
+    lng: -73.996349
+  });
+
+
+  // Map style is based on:
+  // https://snazzymaps.com/style/4183/mostly-grayscale
+  mapApple.addStyle({
+    styledMapName:'Shades Of Grey Map',
+    styles: styleApple,
+    mapTypeId: 'map_apple'
+  });
+
+  mapApple.setStyle('map_apple');
+
+});

public/assets/js/map.bluewater.js

@@ -0,0 +1,77 @@
+$(function() {
+
+  'use strict';
+
+  var styleBlueWater = [{
+    'featureType': 'administrative',
+    'elementType': 'labels.text.fill',
+    'stylers': [{
+      'color': '#444444'
+    }]
+  }, {
+    'featureType': 'landscape',
+    'elementType': 'all',
+    'stylers': [{
+      'color': '#f2f2f2'
+    }]
+  }, {
+    'featureType': 'poi',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'all',
+    'stylers': [{
+      'saturation': -100
+    }, {
+      'lightness': 45
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'simplified'
+    }]
+  }, {
+    'featureType': 'road.arterial',
+    'elementType': 'labels.icon',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'transit',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'all',
+    'stylers': [{
+      'color': '#0866C6'
+    }, {
+      'visibility': 'on'
+    }]
+  }];
+
+  var mapBlueWater = new GMaps({
+    el: '#mapBlueWater',
+    zoom: 14,
+    lat: 40.702247,
+    lng: -73.996349
+  });
+
+
+  // Map style is based on:
+  // https://snazzymaps.com/style/4183/mostly-grayscale
+  mapBlueWater.addStyle({
+    styledMapName:'Blue Water Map',
+    styles: styleBlueWater,
+    mapTypeId: 'map_blue_water'
+  });
+
+  mapBlueWater.setStyle('map_blue_water');
+
+});

public/assets/js/map.mapbox.js

@@ -0,0 +1,109 @@
+$(function() {
+
+  'use strict';
+
+  var styleMapBox = [{
+    'featureType': 'water',
+    'stylers': [{
+      'saturation': 43
+    }, {
+      'lightness': -11
+    }, {
+      'hue': '#0088ff'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'hue': '#ff0000'
+    }, {
+      'saturation': -100
+    }, {
+      'lightness': 99
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'color': '#808080'
+    }, {
+      'lightness': 54
+    }]
+  }, {
+    'featureType': 'landscape.man_made',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': '#ece2d9'
+    }]
+  }, {
+    'featureType': 'poi.park',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'color': '#ccdca1'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels.text.fill',
+    'stylers': [{
+      'color': '#767676'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels.text.stroke',
+    'stylers': [{
+      'color': '#ffffff'
+    }]
+  }, {
+    'featureType': 'poi',
+    'stylers': [{
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'landscape.natural',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'visibility': 'on'
+    }, {
+      'color': '#b8cb93'
+    }]
+  }, {
+    'featureType': 'poi.park',
+    'stylers': [{
+      'visibility': 'on'
+    }]
+  }, {
+    'featureType': 'poi.sports_complex',
+    'stylers': [{
+      'visibility': 'on'
+    }]
+  }, {
+    'featureType': 'poi.medical',
+    'stylers': [{
+      'visibility': 'on'
+    }]
+  }, {
+    'featureType': 'poi.business',
+    'stylers': [{
+      'visibility': 'simplified'
+    }]
+  }];
+
+  var mapMapBox = new GMaps({
+    el: '#mapMapBox',
+    zoom: 14,
+    lat: 40.702247,
+    lng: -73.996349
+  });
+
+
+  // Map style is based on:
+  // https://snazzymaps.com/style/4183/mostly-grayscale
+  mapMapBox.addStyle({
+    styledMapName:'MapBox',
+    styles: styleMapBox,
+    mapTypeId: 'map_mapbox'
+  });
+
+  mapMapBox.setStyle('map_mapbox');
+
+});

public/assets/js/map.shiftworker.js

@@ -0,0 +1,266 @@
+$(function() {
+
+  'use strict';
+
+  var styleShiftWorker = [{
+    'featureType': 'administrative',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'on'
+    }, {
+      'lightness': 33
+    }]
+  }, {
+    'featureType': 'administrative',
+    'elementType': 'labels',
+    'stylers': [{
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'administrative',
+    'elementType': 'labels.text',
+    'stylers': [{
+      'gamma': '0.75'
+    }]
+  }, {
+    'featureType': 'administrative.neighborhood',
+    'elementType': 'labels.text.fill',
+    'stylers': [{
+      'lightness': '-37'
+    }]
+  }, {
+    'featureType': 'landscape',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#f9f9f9'
+    }]
+  }, {
+    'featureType': 'landscape.man_made',
+    'elementType': 'geometry',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '40'
+    }, {
+      'visibility': 'off'
+    }]
+  }, {
+    'featureType': 'landscape.natural',
+    'elementType': 'labels.text.fill',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '-37'
+    }]
+  }, {
+    'featureType': 'landscape.natural',
+    'elementType': 'labels.text.stroke',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '100'
+    }, {
+      'weight': '2'
+    }]
+  }, {
+    'featureType': 'landscape.natural',
+    'elementType': 'labels.icon',
+    'stylers': [{
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'poi',
+    'elementType': 'geometry',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '80'
+    }]
+  }, {
+    'featureType': 'poi',
+    'elementType': 'labels',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '0'
+    }]
+  }, {
+    'featureType': 'poi.attraction',
+    'elementType': 'geometry',
+    'stylers': [{
+      'lightness': '-4'
+    }, {
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'poi.park',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#c5dac6'
+    }, {
+      'visibility': 'on'
+    }, {
+      'saturation': '-95'
+    }, {
+      'lightness': '62'
+    }]
+  }, {
+    'featureType': 'poi.park',
+    'elementType': 'labels',
+    'stylers': [{
+      'visibility': 'on'
+    }, {
+      'lightness': 20
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'all',
+    'stylers': [{
+      'lightness': 20
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'gamma': '1.00'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels.text',
+    'stylers': [{
+      'gamma': '0.50'
+    }]
+  }, {
+    'featureType': 'road',
+    'elementType': 'labels.icon',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'gamma': '0.50'
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#c5c6c6'
+    }, {
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'lightness': '-13'
+    }]
+  }, {
+    'featureType': 'road.highway',
+    'elementType': 'labels.icon',
+    'stylers': [{
+      'lightness': '0'
+    }, {
+      'gamma': '1.09'
+    }]
+  }, {
+    'featureType': 'road.arterial',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#e4d7c6'
+    }, {
+      'saturation': '-100'
+    }, {
+      'lightness': '47'
+    }]
+  }, {
+    'featureType': 'road.arterial',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'lightness': '-12'
+    }]
+  }, {
+    'featureType': 'road.arterial',
+    'elementType': 'labels.icon',
+    'stylers': [{
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'road.local',
+    'elementType': 'geometry',
+    'stylers': [{
+      'color': '#fbfaf7'
+    }, {
+      'lightness': '77'
+    }]
+  }, {
+    'featureType': 'road.local',
+    'elementType': 'geometry.fill',
+    'stylers': [{
+      'lightness': '-5'
+    }, {
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'road.local',
+    'elementType': 'geometry.stroke',
+    'stylers': [{
+      'saturation': '-100'
+    }, {
+      'lightness': '-15'
+    }]
+  }, {
+    'featureType': 'transit.station.airport',
+    'elementType': 'geometry',
+    'stylers': [{
+      'lightness': '47'
+    }, {
+      'saturation': '-100'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'all',
+    'stylers': [{
+      'visibility': 'on'
+    }, {
+      'color': '#14a0c1'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'geometry',
+    'stylers': [{
+      'saturation': '53'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'labels.text.fill',
+    'stylers': [{
+      'lightness': '-42'
+    }, {
+      'saturation': '17'
+    }]
+  }, {
+    'featureType': 'water',
+    'elementType': 'labels.text.stroke',
+    'stylers': [{
+      'lightness': '61'
+    }]
+  }];
+
+  var mapShiftWorker = new GMaps({
+    el: '#mapShiftWorker',
+    zoom: 14,
+    lat: 40.702247,
+    lng: -73.996349
+  });
+
+  // Map style is based on:
+  // https://snazzymaps.com/style/4183/mostly-grayscale
+  mapShiftWorker.addStyle({
+    styledMapName:'Shift Worker Map',
+    styles: styleShiftWorker,
+    mapTypeId: 'map_shift_worker'
+  });
+
+  mapShiftWorker.setStyle('map_shift_worker');
+
+});