diff --git a/web/js/main.js b/web/js/main.js index 31a4fddf0b..edd4719f86 100644 --- a/web/js/main.js +++ b/web/js/main.js @@ -57,7 +57,7 @@ import {palettesModel} from './palettes/model'; import imageRubberband from './image/rubberband'; import imagePanel from './image/panel'; // Notifications -// import NotificationsUI from './notifications/notifications.ui'; +import {notificationsUi} from './notifications/ui'; // UI import loadingIndicator from './ui/indicator'; // not a class, export object // Link @@ -272,9 +272,9 @@ window.onload = () => { } ui.link = linkUi(models, config); // ui.tour = Tour(models, ui, config); - // ui.info = uiInfo(ui, config); + ui.info = uiInfo(ui, config); if (config.features.alert) { - // ui.alert = notificationsUi(ui, config); + ui.alert = notificationsUi(ui, config); } // FIXME: Old hack diff --git a/web/js/notifications/wv.notifications.ui.js b/web/js/notifications/ui.js similarity index 93% rename from web/js/notifications/wv.notifications.ui.js rename to web/js/notifications/ui.js index 3bf3dd1df8..13242f9fa6 100644 --- a/web/js/notifications/wv.notifications.ui.js +++ b/web/js/notifications/ui.js @@ -1,15 +1,15 @@ -var wv = wv || {}; -wv.notifications = wv.notifications || {}; - +import $ from 'jquery'; +import util from '../util/util'; +import loIsEmpty from 'lodash/isempty'; +import wvui from '../ui/ui'; /* * @Class */ -wv.notifications.ui = wv.notifications.ui || function (models, config) { +export function notificationsUi(models, config) { var self = {}; var mainNotification; var mainIcon; var mainIconLabel; - var secondaryNotification; var sortedNotifications = {}; var activeNotifications = {}; @@ -21,7 +21,7 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { url = config.features.alert.url; messageBlockExists = false; alertBlockExists = false; - self.events = wv.util.events(); + self.events = util.events(); self.infoIconActive = false; self.notifyIconActive = false; self.messageIconActive = false; @@ -42,15 +42,15 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { * @returns {void} */ var init = function () { - var reactComponent, options, p, alertUser; - if (!wv.util.browser.localStorage) { + var p; + if (!util.browser.localStorage) { return; } mainIcon = $('#wv-info-button')[0]; mainIconLabel = $('#wv-info-button label')[0]; - p = wv.util.get(url); + p = util.get(url); p.then(function (response) { - var obj, notifications, alert; + var obj, notifications; obj = JSON.parse(response); notifications = obj.notifications; @@ -194,10 +194,12 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { * @returns {void} */ var separateByType = function (obj) { - var messages = [], - alerts = [], - outages = [], - type, subObj; + var type; + var subObj; + var messages = []; + var alerts = []; + var outages = []; + for (var i = 0, len = obj.length; i < len; i++) { subObj = obj[i]; type = subObj.notification_type; @@ -295,7 +297,7 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { self.getAlert = function () { var $notifyMenuItem, alertsNumber, outageNumber, count, hide; - if (!_.isEmpty(activeNotifications)) { + if (!loIsEmpty(activeNotifications)) { alertsNumber = getNumberOfTypeNotseen('alert', sortedNotifications.alerts); outageNumber = getNumberOfTypeNotseen('outage', sortedNotifications.outages); count = outageNumber + alertsNumber; @@ -396,7 +398,7 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { $notifyContent.append(create$block(sortedNotifications.outages, 'outage')); $notifyContent.append(create$block(sortedNotifications.alerts, 'alert')); - $dialog = wv.ui.getDialog() + $dialog = wvui.getDialog() .append($notifyContent); $dialog.dialog({ @@ -426,7 +428,7 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { width = 625; height = 'auto'; - if (wv.util.browser.small || wv.util.browser.touchDevice) { + if (util.browser.small || util.browser.touchDevice) { width = $(window) .width(); height = $(window) @@ -447,7 +449,11 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { * @returns {Object} Jquery ul element */ var create$block = function (arra, title) { - var $li, date, numNotSeen, activeClass, $ul = $(''); + var $li; + var date; + var numNotSeen; + var activeClass; + var $ul = $(''); numNotSeen = getNumberOfTypeNotseen(title, sortedNotifications[title + 's']); @@ -457,7 +463,7 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { activeClass = title; } date = new Date(arra[i].created_at); - date = date.getDate() + ' ' + wv.util.giveMonth(date) + ' ' + date.getFullYear(); + date = date.getDate() + ' ' + util.giveMonth(date) + ' ' + date.getFullYear(); $li = $('
  • ' + title + ' Posted ' + date + '

    ' + arra[i].message + '

  • '); $ul.append($li); } @@ -492,16 +498,16 @@ wv.notifications.ui = wv.notifications.ui || function (models, config) { * @returns {void} */ var create$whatsNew = function (obj, title) { - var $dialog, width, height, $notifyContent, releasePageUrl, date, dimensions; + var $dialog, $notifyContent, releasePageUrl, date, dimensions, $footer; date = new Date(obj.created_at); - date = date.getDate() + ' ' + wv.util.giveMonth(date) + ' ' + date.getFullYear(); + date = date.getDate() + ' ' + util.giveMonth(date) + ' ' + date.getFullYear(); releasePageUrl = config.features.alert.releases || 'https://github.com/nasa-gibs/worldview/releases'; dimensions = getModalDimensions(); $notifyContent = $('

    ' + title + ' Posted ' + date + '

    ' + obj.message + '

    '); $footer = $(''); $notifyContent.append($footer); - $dialog = wv.ui.getDialog() + $dialog = wvui.getDialog() .append($notifyContent); $dialog.dialog({ title: 'What\'s New', diff --git a/web/js/ui/info.js b/web/js/ui/info.js index 875298d7bf..5520b58659 100644 --- a/web/js/ui/info.js +++ b/web/js/ui/info.js @@ -6,7 +6,7 @@ import wvui from './ui'; import util from '../util/util'; import feedbackModal from '../feedback'; -export function info (ui, config) { +export function uiInfo (ui, config) { var selector = '#wv-info-button'; var $button = $('') .attr('type', 'checkbox')