I have the following code, I use this pattern for the entire JavaScript code. I'm trying to re-factor my code again. Should I use the Module pattern? Revealing Module Pattern to be specific?
What's happening is, somewhere in my code I say Dnianas.Notification.init()
.
First I bind the events, and I will handle them one by one.
Is there a better way to do this?
Also I notice that I don't use the var
keyword. because they depend on each other.
Dnianas.Notification = {
init: function () {
this.bindEvents();
this.cache();
},
bindEvents: function () {
$(document).on('click', '#opennotifii', this.markAsRead);
},
cache: function () {
$notification = $('#opennotifii');
},
countNotifications: function () {
var $notifications = $('.boxnotificationsusers').children().find('#boxsendnotifi');
ids = [];
// Add unread notifications to the ids array.
$notifications.each(function () {
if ($(this).data('read') === 0) {
ids.push($(this).data('id'));
}
});
return ids;
},
markAsRead: function () {
self = Dnianas.Notification;
ids = self.countNotifications();
if (ids.length > 0) {
var request = $.ajax({
url: '/notifications/read',
data: {
notifications: ids,
_token: token,
}
});
request.done(function (data) {
self.renderNotificationCount(data);
});
}
},
renderNotificationCount: function (data) {
if (data.seen) {
$notification.find('.not_nu1').fadeOut(200);
}
}
};
$('.boxnotificationsusers').children().find('#boxsendnotifi')
. Id values should be unique in the document, but this looks like you expect to fine several'#boxsendnotifi'
items. \$\endgroup\$