burning

Solutions for user notifications on front-end

Recommended Posts

Hi all,

Im currently building a photo sharing website and have a first version finished. Next step is to incorporate notifications in the website if a user likes one of your photo's, or comments on a photo you posted.

Just like the notification bell at the top of the forums. Any idea how to approach this functionality?

Thanks in advance.

Share this post


Link to post
Share on other sites
  • Send AJAX requests to poll the server for updates. Easy to implement but puts strain on the server. 
  • Use long polling (reply to a request only when there's an update on the server). A bit more difficult, but fewer unnecessary requests. 
  • Use websockets (Socket.io, Pushy for push notifications) or SSR (server sent events). Ideal, but a bit more involved to implement.
  • Like 2

Share this post


Link to post
Share on other sites

intercooler.js (which I may have mentioned before :rolleyes:) has beta support for Server Sent Events. I haven't tried SSE, but I'm a big fan of intercooler generally.

  • Like 3

Share this post


Link to post
Share on other sites

Thanks for the suggestions guys.

Another question; how do i store these 'notifications' in my processwire installation, and how do i check whether they are 'read or seen' by the user, and thus delete them?

Share this post


Link to post
Share on other sites

You'd have to represent each reaction (e.g. seen, read) using a Page with a user (Page Reference) and a timestamp field (using `created` may suffice) and relate it to an action (e.g. X posted a new picture).

Using simple image fields for storing images probably wouldn't be enough. Because images now have to hold a lot more data than they were designed for (when was this image posted, who reacted to it, what was the reaction). You'd need a more complex data structure (using Pages and fields, or custom fieldtypes) to represent all actions, reactions and events.

In short: it's not trivial. Or I'm making this complicated in my head.

  • Like 1

Share this post


Link to post
Share on other sites
3 minutes ago, abdus said:

In short: it's not trivial. Or I'm making this complicated in my head.

Absolutely right, it's not trivial and it can very quickly become properly complicated.  @abdus has very quickly pretty much nailed my current thinking on this kind of functionality.

I'm currently working on just such a system (with the added extra of location-aware messages), but by breaking it down into manageable bits (I'm hoping) it becomes feasible. 

Share this post


Link to post
Share on other sites

Thanks.

I already have a sort of page structure with images and users. So when a user likes a image, the image id is stored in a field in the user template so i can keep track on which user likes which image. The image itself is a page containing data of the image (title, description, exif data of the image, user_id who added the image, etc).

Of course I can add the user_ids to a field to the image page itself, but that doesn't keep track if the user of which the image belongs to has 'seen' the notification.

 

Share this post


Link to post
Share on other sites

I *think* you could replace the field in the user template (a user is a page, right?) with a repeater or a PageTable (best bet) and use this to store references to 'reactions'. These being pages, could then contain fields for image/page id, kind of reaction (like/share whatever), and that the image poster has been notified of that reaction.

Share this post


Link to post
Share on other sites

Ah that indeed would be a good start i guess. Thanks for your replies. I will make a start of the functionality tonight and keep u updated with the progress :-) 

Share this post


Link to post
Share on other sites
On 19.10.2017 at 1:21 PM, burning said:

Ah that indeed would be a good start i guess. Thanks for your replies. I will make a start of the functionality tonight and keep u updated with the progress :-) 

How did you do it in the end?

I'm thinking about how to implement such a feature as well. But instead of additional fields I'm thinking to save some variables in the user session and compare them with the actual data.

I have to do some more research to see if that really is an option.

Share this post


Link to post
Share on other sites
On 4/27/2018 at 7:46 PM, Schwab said:

How did you do it in the end?

I'm thinking about how to implement such a feature as well. But instead of additional fields I'm thinking to save some variables in the user session and compare them with the actual data.

I have to do some more research to see if that really is an option.

I ended up having a repeater in each userPage, when someone likes a photo, a Ajax request is sent and adding an item to the repeater, storing userId and the action (eg. like, follow comment oid). Then i built a simple notification window, which reads the repeater in the user-specific page and displays the correct message.

Share this post


Link to post
Share on other sites
On 6/16/2018 at 2:12 PM, burning said:

I ended up having a repeater in each userPage, when someone likes a photo, a Ajax request is sent and adding an item to the repeater, storing userId and the action (eg. like, follow comment oid). Then i built a simple notification window, which reads the repeater in the user-specific page and displays the correct message.

Yes I see. It depends on what notifications you want to have and who you want to notify.

I ultimately made it with an additional field on the page the user created. That field stores a MD5 Hash of the page content. When there is a change in the content, the hash changes. On the users dashboard I compare the page hash with the saved hash, if they differ, the user gets notified. When the user loads the page, his hash gets updated. 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By EyeDentify
      Hello Fellow PW Fans and Gurus.

      I have run into a problem where i have created a template without a template file associated with it.
      Now i would like to HAVE a template file associated with it, not an alternate but as the main template file.

      So i thought, that's easy, I upload the template file and change it in template settings but I only get the Alternate template file setting?

      Ok so maybe i can change it via the API , so i wrote some code for this.
      <?PHP function changeTemplate($pages = null, $templates = null) { /* get the pages to change template on */ $logItems = $pages->findMany('template=tmp_log_item'); /* get the template object for our desired template */ $Template = $templates->get('tmp_new_log_item'); foreach($logItems AS $key => $logData) { /* use template object $Template to set template */ $logData->template = $Template; /* save page item */ $logData->save(); } } /* do the magic change */ changeTemplate(); ?> Needless to say, PW was not happy about this, It throw up an error message:
      Error: Exception: Invalid value sent to Page::setTemplate (in /home/virtual/mydomain/public_html/wire/core/Page.php line 1782)
      Now from what i understand i gave $logData->template the wrong type of value.
      So what should the value be to correct this?
      When I read the docs at: https://processwire.com/api/ref/page/
      the value can be "string" or "Template".

      So i gave it a string and it went haywire.

      How should I approach this cause I realy dont want to manually change template file on över 50 plus pages

      Maybe I should use the Template class to create the value that the API wanted, but I am unsure how to use it.

      Thank you for any info you can give me on this.

      If you want more info to help me, ask and I will try my best to give it to you.
      Updated and Solved
      I solved the problem and have updated the code to reflect this.

      Essentialy i used the get() method of $templates to get the template object for my template i wanted to use using the template name.
      I gave the Object to the $logData->template property and all went well.
      We learn something new every day.
      One Note:
      The template file you want to use must have been uploaded and added as a template in the Template section in the Admin for this code to work as expected.
    • By chcs
      After running this code in my module's __install() the template_id is not set. Any ideas why?  (The export contents from the template created and the one that I built with Admin are the same. Both exports have the template_id is set to mm_state. When I go to edit the field in Admin, the template is not showing on the Input tab and it doesn't show the template title on a page using the template that uses this field. Using processwire 3.0.98)

      // mm_state
      $field = $this->fields->get('mm_state');
      if (!@$field->id) $field = new Field();
      $field->type = $this->modules->get("FieldtypePage");
      $field->name = 'mm_state';
      $field->label = 'State';
      $field->derefAsPage = 2;
      $field->inputfield = "InputfieldSelect";
      $this->fields->save($field);
      $field->labelFieldName = 'title';
      $field->template_id = 'mm_state';
      $field->columnWidth = 100;
      $field->required = true;
      $this->fields->save($field);
    • By louisstephens
      So I have a project where multiple pages are sending POST data to 1 single template page.  All was working well (well, at least with one ajax post), but now I have hit a stumbling block. I figured  the "best" way to handle the request were to use url segments and then use the following in the status page:
      if ($config->ajax && $input->urlSegment1 == 'add-bookmark') { // some code here } However, this doesnt seem to really work (as I assume the the request isnt being posted to /status/ but rather to /status/add-bookmark/). What is the best way to actually handle this?
    • By louisstephens
      Currently, I have a page set up listing all child pages using a foreach loop and outputting some information (thus far, it is all gravy). However, I ran into a slight problem. I have a "button" on each item being rendered that when clicked needs to send the page id to another page for processing via ajax. I thought I could just save the item id like :
      <?php $itemId = $item->id; ?> And then encoding it below in my javascript:
      var itemId = <?php echo json_encode($itemId); ?>; var data = { itemId: itemId, }; $.ajax({ type: "POST", url: "/intra/status/", data: data, success: function(){ console.log(itemId); } }); However, it is only posting the last page's id rendered by the foreach. Have I just overlooked something simple on this?
    • By mattcohen
      Hi, I am wondering if someone can help me out with getting the count of the comments of a page? 
      I am using Ryan's comments module as a reviews system for my site and would like to display the count of the comments per page, as below 
       

       
      The shops part that you see above is something similar to this 
      <?php $set_page = $page->title; $count = $pages->count("template=prices, title=$set_page"); echo $count; ?>