Skip to content
Permalink
Browse files

Browser Notification

  • Loading branch information...
Depado committed May 20, 2014
1 parent 7b3efd2 commit dc975c68de5cded5b2c534ba2e0c356cdab686ed
Showing with 85 additions and 22 deletions.
  1. +2 −1 app.js
  2. +72 −21 static/custom.js
  3. +11 −0 views/index.html
3 app.js
@@ -70,10 +70,11 @@ io.sockets.on('connection', function (socket) {
if(socket.username in usernames) {
delete usernames[socket.username];
socket.emit('server-message', 'Now known as ' + new_username);
socket.emit('username', {'type': 'change', 'username': new_username});
socket.broadcast.emit('server-message', socket.username + ' is now known as ' + new_username);
} else {
socket.emit('server-message', 'Now connected as ' + new_username + ' (/help for commands)');
socket.emit('connection-success');
socket.emit('username', {'type': 'create', 'username': new_username});
socket.broadcast.emit('server-message', new_username + ' is now connected');
anon_users -= 1;
}
@@ -7,10 +7,20 @@ function titleNotify(isActive) {
if(!isActive && document.title != "[New] Unicorn Chat") document.title = "[New] Unicorn Chat";
}

function errorNotify (message) {
$('#error-message').text(message);
$('#error-message').show();
setTimeout(function() {
$('#error-message').fadeOut(500);
}, 2000);
}

var isActive;
window.onfocus = function () { isActive = true; document.title = "Unicorn Chat"; };
window.onblur = function () { isActive = false; };

var selfusername = undefined;

var socket = io.connect(window.location.protocol+'//'+window.location.hostname+':'+window.location.port);

socket.on('updatechat', function (username, data) {
@@ -20,7 +30,22 @@ socket.on('updatechat', function (username, data) {
+ d.getHours() + ':' + (d.getMinutes()<10?'0':'') + d.getMinutes() + '] ' + username + ' > ' + data
+ '</p></div></li>'
);
if(!isActive && document.title != "[New] Unicorn Chat") document.title = "[New] Unicorn Chat";
if(!isActive) {
if(document.title != "[New] Unicorn Chat") document.title = "[New] Unicorn Chat";
if ("Notification" in window) {
if(Notification.permission === "granted") {
if($('#notify-on-message').is(':checked')) {
var notification = new Notification(username + ' : ' + data, {'icon': "/custom/favicon.gif"});
}
if ($('#notify-on-hl').is(':checked')) {
var patt = new RegExp("(^|\\W)"+selfusername+"(\\W|$)");
if(patt.test(data)) {
var notification = new Notification(username + ' highlighted you.', {'icon': "/custom/favicon.gif"});
}
}
}
}
}
scrollDown();
});

@@ -30,18 +55,21 @@ socket.on('server-message', function(data) {
scrollDown();
});

socket.on('connection-success', function() {
$('#nickname-send').html('Change');
$('#data').show();
$('#activate-browser-notifications').show();
socket.on('username', function(data) {
if(data['type'] === 'create') {
$('#nickname-send').html('Change');
$('#data').show();
if(Notification.permission !== 'granted' && Notification.permission !== 'denied') {
$('#activate-browser-notifications').show();
} else {
$('#notify-settings').show();
}
}
selfusername = data['username'];
});

socket.on('error', function (data) {
$('#error-message').text(data);
$('#error-message').show();
setTimeout(function() {
$('#error-message').fadeOut(500);
}, 2000);
errorNotify(data);
});

socket.on('updateusers', function(data) {
@@ -55,12 +83,43 @@ socket.on('updateusers', function(data) {
socket.on('disconnect', function() {
$('#data').hide();
$('#activate-browser-notifications').hide();
$('#notify-settings').hide();
$('#nickname-send').html('Connect');
$('#conversation').append('<p>You\'re disconnected.</p>');
titleNotify(isActive);
scrollDown();
});

$(function(){
$(function() {
var windowWidth = $(document).width();
var windowHeight = $(document).height();
var current_dash = 0;

$('#data').hide();
$('#activate-browser-notifications').hide();
$('#notify-settings').hide();

if (!("Notification" in window)) {
$('#activate-browser-notifications').attr('disabled', true);
}

$('#activate-browser-notifications').click(function(){
if (!("Notification" in window)) {
errorNotify("This browser does not support desktop notification");
} else if (Notification.permission !== 'granted') {
Notification.requestPermission(function (permission) {
if(!('permission' in Notification)) {
Notification.permission = permission;
}
if (permission === "granted") {
var notification = new Notification("Thanks for activating Notifications.", {'icon': "/custom/favicon.gif"});
$('#activate-browser-notifications').hide();
$('#notify-settings').show();
}
});
}
});

$('#data').keypress(function(e) {
if(e.which == 13) {
var message = $('#data').val();
@@ -83,20 +142,12 @@ $(function(){
}
});

$('#data').hide();
$('#activate-browser-notifications').hide();

var windowWidth = $(document).width();
var windowHeight = $(document).height();
var current_dash = 0;

function launchPony () {
current_dash += 1;
var this_dash = current_dash;
var image = "/custom/images/rdash.gif";
var position = Math.floor((Math.random() * 90) + 1);
$('body').append(
'<img id="dash_'+ this_dash + '" src="' + image + '" style="position: absolute; bottom:' + position + 'px; left:-100px;z-index:-' + position + ';">'
'<img id="dash_'+ this_dash + '" src="/custom/images/rdash.gif" style="position: absolute; bottom:' + position + 'px; left:-100px; z-index:-' + position + ';">'
);
$('#dash_' + this_dash).animate({left: windowWidth}, 5000, function() {
$('#dash_' + this_dash).remove();
@@ -110,7 +161,7 @@ $(function(){
socket.on('dashrain', function() {
for (var i = 20; i >= 0; i--) {
var wait = Math.random() * 10000;
setTimeout(function() {
setTimeout(function() {
launchPony();
}, wait);
};
@@ -42,6 +42,17 @@
Activate Browser Notification
</button>
<span id="error-message"></span>
<span class="pull-right" id="notify-settings">
<label style="font-weight: normal;">
<input type="checkbox" name="checkbox" id="notify-on-hl">
Notify me on Highlight
</label>
<label style="font-weight: normal;">
<input type="checkbox" name="checkbox" id="notify-on-message" />
Notify on New Message&nbsp;
</label>
</span>
</div>
</div>
</div>
</div>

0 comments on commit dc975c6

Please sign in to comment.
You can’t perform that action at this time.