(3) Instant Notifications in Page Title like Facebook

[findingpeace]

Using javascript and AJAX, we have implemented a system that updates notifications for likes, subscribed threads, and PM's in the page title, similar to Facebook. We use it on our site:

http://psychopathfree.com/forum.php

It updates live, so even if they're visiting another site and the tab is sitting idle, they will see new notifications popup instantly.

It's not very good coding, and I'm sure there is a better way to do it But if anyone would like this on their site, let me know. I would be happy to share our method.

In the past day alone of enabling it, we've seen a 400+% increase in user engagement, new posts, new activity, and online users.

[vimarc]

Hi I checked your site but didn't find.

[findingpeace]

Hey marc, the notifications will only show up for registered users who have a notification - I can post an example screenshot here:

[vimarc]

hi thanks..

which donate mod you are using?

[FTG LIQUID CL]

I would like to have this!

[findingpeace]

Originally Posted by FTG LIQUID CL

I would like to have this!

Hi FTG - which mods do you currently use that utilize the notifications system? (ie. Recent Thanks, Subscribed Thread Notifications, etc?)

Thanks

[FTG LIQUID CL]

VSA advanced new post

Cel Social Groups Notifications

[deltahawk5]

Woah, I'd love to have this.

I have DBTech Advanced Tagging and Thanks for Post (Hippy Fix) with Notifications.

[findingpeace]

Hi all,

Okay so here is the code I use, but it'll be different of course depending on what notifications mods you use. I would also definitely recommend getting the DBTech AJAX vbNotifications mod, since it will align perfectly with the instant title updates. It automatically detects & integrates both of the mods you guys have mentioned. Otherwise, users will be getting the (#) notification but still need to refresh the page to see it in the old vBulletin notifications bar.

I have chosen to put it in FORUMHOME, FORUMDISPLAY, SHOWTHREAD, and USERCP_SHELL. You could do it in any template you want these to be visible. Just keep in mind, it operates on a 30 second Javascript timer, so it will partially boost your page requests. I definitely wouldn't put it in a global template (like footer or something). It needs to be placed somewhere in the head tag.

<script type="text/javascript">
setInterval(function() {
 var data = "{vb:raw relpath}";
    $.get(document.location.toString()).then(function (data){
       //find and set the title of the page
       document.title = data.match(/<title>(.+)<\/title>/)[1];
    });
}, 30000);

setTimeout(function() {
 var data = "{vb:raw relpath}";
    $.get(document.location.toString()).then(function (data){
       //find and set the title of the page
       document.title = data.match(/<title>(.+)<\/title>/)[1];
    });
}, 1000);
</script>

This does two things: 1) Sets a 30 second timer (you can change this to whatever you want) to refresh the notifications. 2) Sets a single-time, 1-second timeout to refresh the notifications upon page load, in case they've updated since the click.

In each of these pages, you will also need to set the new initial Page Title. This will be different for each template you modify. For example, the Title element of USERCP_SHELL should be modified to look like this:

<title><vb:if condition="$title_note_count">({vb:raw title_note_count}) </vb:if>{vb:raw pagetitle} - {vb:raw vboptions.bbtitle}</title>

The bold part is the added change. You can add that as a prefix to any of the page titles and it will show the notifications in the title.

Now the part that will be different for everyone: $title_note_count

This is the variable I'm pushing to my templates through a plugin / hook. It's the current total notification count. Depending on what mods you're using, your code will probably be different than mine. Here's an example of the plugin I use:

Hook: process_templates_complete
Execution Order: 5

global $vbulletin;

$currentuserid = $vbulletin->userinfo[userid]; 

$query = "SELECT * FROM vbuser WHERE userid = $currentuserid";
$result = $vbulletin->db->query($query);

while($row = $vbulletin->db->fetch_array($result)) {

    $a = $row['friendreqcount'];
    $b = $row['vmunreadcount'];
    $c = $row['socgroupinvitecount'];
    $d = $row['socgroupreqcount'];
    $e = $row['pcunreadcount'];
    $f = $row['vbseo_likes_unread'];
    $h = $row['pmunread'];
    $i = $row['recent_thankcnt'];
}


$title_note_count = $a + $b + $c + $d + $e + $f + $h + $i;

vB_Template::preRegister('FORUMHOME',array('title_note_count' => $title_note_count));
vB_Template::preRegister('SHOWTHREAD',array('title_note_count' => $title_note_count));
vB_Template::preRegister('recent_thanks',array('title_note_count' => $title_note_count));
vB_Template::preRegister('FORUMDISPLAY',array('title_note_count' => $title_note_count));
vB_Template::preRegister('USERCP_SHELL',array('title_note_count' => $title_note_count));
vB_Template::preRegister('newthread',array('title_note_count' => $title_note_count));
vB_Template::preRegister('newreply',array('title_note_count' => $title_note_count));

I use this code because the vbNotifications mod disables the "Total Notifications" variable. If you don't use that mod, you can probably much more easily grab the total notifications by just registering the existing variable in the same hook as above, without all the database calls:

$vbulletin->userinfo['notifications_total'] = $notifications_total;

Let me know how this works, and I will stick around here to help out as much as I can Also, if anyone knows a better way to push notifications with AJAX, feel free to post! The timer isn't the best idea in the world, but my server's resources are 100% fine running 30 seconds. I even experimented with 5 seconds and found no performance issues.

[FTG LIQUID CL]

I cant seem to get this to work.I dont use vbNotifications,where does the last piece of code go?