New Popup (Annotation) Notification?

[Jack Brown]

Is there a way that when a user of my web app creates any kind of annotation using one of the annotation tools and clicks the "save" button or is autosaved that somehow users can be notified of this? Like the moment the button is clicked a user of my app can, for example, receive a simple message stating "Jack added a Sticky to Document 1".  My app runs on a PHP framework and I can just use PHP to grab the document name and the name of the user who created the annotation to personalize it but how could I create the message alert/notification? ANY semblance of sample code you have will greatly help. If you don't please give me a good idea as to how I could go about doing this. It seems in reach and I'm not asking for a lot.

[Matt Parizeau]

To be able to have other users be notified of changes like this you either need to have the server send a notification to the client or you need to have the client polling the server for updates.

Having the server notify the client is the most efficient and quickest and you would probably want to use WebSockets. I haven't used WebSockets with a PHP server before but a quick search shows maybe you'd use a library like this. Also here's a tutorial for a WebSocket chat application which seems similar to the functionality required by your web app where a message is sent from one client and received right away on another client.

If you want to poll then you can just send an ajax request to your server every few seconds and your server would have to remember recently saved annotations and return a response with that information.

To display a message to the user you could take a look at the code that is used in ReaderControl to display a message when annotations are saved. If you look in ReaderControl.js in the saveAnnotations function there is an overlayMessage element that is shown as a jQuery UI dialog. In the success and error callbacks you can see the setting of the data-i18n attribute. This is just for the internationalization library WebViewer uses so you could instead just set overlayMessage.text('my message') or you could modify translation-en.json yourself to add more translations.

Matt Parizeau

Software Developer

PDFTron Systems Inc.

[Jack Brown]

How would I even integrate Webviewer like this Ratchet API anyway since the Webviewer is all housed in basically two js libraries and i have a custom js file running in conjunction with my application. Can you be more specific where I can begin with this? Also I searched in this forum for Ajax polling and I saw posts made by you and someone else named Kevin and they were really confusing since the sample code ya'll placed was already in the readercontrol js code already but commented out?

[Support]

Hi Jack,

This type of notifications is definitely something you could do with WebViewer. Since ReaderControl is open source, implementation-wise this is all in your court. We can only nudge you in the right direction.

For a sample integration that implements real-time collaboration on top of WebViewer, please take a look at http://xodo.com ( it is a free PDF annotator for mobile devices with real-time collaboration features):

    http://xodo.com/view/#/collab/242ab2c3-ae52-4eaa-892a-a46f1ae6c8e7

It is true that setting-up servers all scalable and robust infrastructure to support collab & notifications is a bit of pain. We already got a number of requests to add this style of real-time collaboration API to PWS Cloud API (https://api.pdftron.com/v2/docs). So if you would be interested in using this API, please let us know. If there are enough requests we may end up rolling out the functionality as part of the next update.