FreeTextAnnotation Issues on iOS

271 views
Skip to first unread message

David Compton

unread,
Apr 2, 2019, 2:25:24 PM4/2/19
to PDFTron WebViewer
I've noticed some issues on iOS for our Ionic Application.  These issues do not exist on Android or the web application built with the same code base.  

To replicate:

1.  Tap free text button
2.  Tap in document
3.  First issue here is that the annotation loses focus so you have to tap it again to enter text.
4.  Next issue is that when tapping it the little pop up toolbar appears.  When you tap on the comment icon it momentarily puts the cursor in the annotation (after "Insert text here") and then once again loses focus.  So there is no way to enter comment text directly in the annotation.  You can do it via the viewer sidebar.
5.  After doing one free text annotation there is no way to add another one without closing and re-opening the application.  Tapping on the free text annotation button and then tapping in the document does nothing.  Tapping on the pan button and then back on the free text button does not help.
6.  It would also be much better if "Insert text here" was highlighted automatically when the the user goes to type in text for the first time.  This is the behavior on Android and the web.

You can test this out on our app "Docs On Tap V2" from the App Store.  Just select the Trial option when prompted for a verification code.

Kind regards,

David Compton

David Compton

unread,
Apr 2, 2019, 7:39:12 PM4/2/19
to PDFTron WebViewer
Just a bit more information.  I note that these issues do not exist in our web app (same Ionic code base) in Safari on the iPad.

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
For more options, visit https://groups.google.com/d/optout.


--

Zhijie Zhang

unread,
Apr 9, 2019, 8:50:56 PM4/9/19
to PDFTron WebViewer
Hi David,

Sorry for the delay in our response. Unfortunately we are having trouble reproducing the issue you are seeing.

We downloaded "Docs On Tap V2" from the App Store and tried tapping in the document to make a free text annotation. 
We see a free text annotation with a white background being created and the focus didn't get lost. We were also able to create subsequent free text annotations.
However we did see that "Insert text here" is not automatically selected so we will provide a fix for that.

Is there anything I'm missing? On my end the free text annotation in the app just works as it used to... Could you tell us when this issue started happening? 

Best Regards,
Zhijie Zhang
Software Developer
PDFTron Systems Inc.

David Compton

unread,
Apr 11, 2019, 12:29:28 PM4/11/19
to PDFTron WebViewer on behalf of Zhijie Zhang
You may find that you need to download the video to hear the audio - audio does not seem to work when viewed directly in the browser.  

On Wed, 10 Apr 2019 at 12:12, David Compton <david.w...@gmail.com> wrote:
Hi Zhijie,

I've attached a video showing the problem that I'm experiencing.  The video has audio explaining what I am doing and the problem that I am experiencing.

Kind regards,

David

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
For more options, visit https://groups.google.com/d/optout.


--


--

Zhijie Zhang

unread,
Apr 11, 2019, 12:34:06 PM4/11/19
to PDFTron WebViewer
Hi David,

It seems that the video you attached got dropped somehow. Do you mind posting it again? 
If google group is prevent you from uploading a video, you can send it to my email: zzh...@pdftron.com.

Thanks,

David Compton

unread,
Apr 11, 2019, 8:04:54 PM4/11/19
to PDFTron WebViewer
Hi Zhijie,

I did send through another link to the video uploaded to Google Drive.  Anyway I've emailed the video directly to you.

Kind regards,

David

Zhijie Zhang

unread,
Apr 17, 2019, 6:21:14 PM4/17/19
to PDFTron WebViewer
Hi David,

Thanks for sending me the video. 

Looks like the zoom value changes after the virtual keyboard shows up. This will refresh the page and remove the textarea element in the DOM which result in losing focus. 
However I didn't see that happening when I tried to reproduce this issue using our cordova sample https://github.com/PDFTron/webviewer-cordova-sample.
One thing you can try is to go to onFitModeUpdated.js, and change the code in the second else if block to the following:

core.fitToZoom();
dispatch(actions.setFitMode('FitPage'));

rebuild the UI and see if it resolves the issue.

Regarding the issue where you are not able to create freetext annotations anymore, we were able to fix a similar issue and it will be included in our 5.1 release which will likely be within the next few weeks.
In the coming 5.1 we also made the "Insert text here" automatically selected after a freetext annotation is created.

Best Regards,
Zhijie Zhang
Software Developers
PDFTron Systems Inc.

David Compton

unread,
May 6, 2019, 1:11:30 PM5/6/19
to PDFTron WebViewer on behalf of Zhijie Zhang
Hi Zhijie,

Your suggested change did not seem to help.  

However Justin has recently sent me an update to try out with a fix for the iOS continuous scrolling issue.  I noticed that it also contains the improvements related to free text annotations that you said will be in 5.1.  These changes seem to fix all of the issues that I reported in relation to free text annotations.  Thank you - works nicely selecting the "Insert text here".  

I do however still have a couple of new issues related to the free text annotation (sorry).

1.  If I tap near the right hand side of the page then the free text annotation box goes off the right hand side of the page (sometimes it jumps back within the page bounds while typing the text and then jumps back out to the right again once it loses focus). I do have the following code in my custom config file:

docViewer.getTool('AnnotationCreateFreeText').setStyles(function(currentStyle) {
            return {
                StrokeThickness: 0,
                //StrokeColor: new Annotations.Color(255, 255, 255),
                TextColor: new Annotations.Color(98, 115, 230),
                FontSize: '12pt'
            };
        });

        var mouseLeftUp = Tools.FreeTextCreateTool.prototype.mouseLeftUp;
        Tools.FreeTextCreateTool.prototype.mouseLeftUp = function(e) {
            var annotManager = docViewer.getAnnotationManager();
            if (annotManager.getAnnotationByMouseEvent(e)) {
                this.annotation = null;
                mouseLeftUp.apply(this, arguments);
                return;
            }

            if (this.annotation) {
                var newWidth = 200;
                var newHeight = 100;

                this.annotation.setRect(new Annotations.Rect(this.annotation.X, this.annotation.Y, this.annotation.X + newWidth, this.annotation.Y + newHeight));
                this.annotation.setPadding(new Annotations.Rect(0, 0, 0, 0));
            }

            mouseLeftUp.apply(this, arguments);
        };

2.  Select free text annotation, tap in the document and then type your text.  All good - but then if you tap the pan icon in the toolbar the annotation is still selected with the little pop-up toolbar showing.  You have to tap somewhere else in the document in order for the free text annotation to be not selected.  I would have thought that tapping the pan button would take the focus away from the free text annotation altogether?   

3.  I found in this version from Justin was that after adding multiple annotations it occasionally (twice) became impossible to add any more annotations - this occurred with both free text and comment annotations.  I could move to a new page  but the ability to add annotations stopped working - along with the ability to click on other buttons.   I have tried to replicate the problem since without success - so I cannot give you any more precise information.  I know that if you/we cannot reproduce this issue consistently then there is not going to be much you can do about it.  But I thought I would raise it anyway.

Thanks for your work on this.

Regards,

David


--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
For more options, visit https://groups.google.com/d/optout.


--

David Compton

unread,
May 9, 2019, 2:34:46 PM5/9/19
to PDFTron WebViewer on behalf of Zhijie Zhang
Hi Zhijie,

Further to my earlier feedback, as I've been using the version provided by Justin more I've also noticed that on many occasions the "insert text here" is not selected when you create a new annotation.  I have not been able to notice any particular pattern as two when it is selected and when it is not.

Kind regards,

David
--

Justin Jung

unread,
May 13, 2019, 8:13:34 PM5/13/19
to PDFTron WebViewer
Hi David,

Since there is an overlap between the issues you reported here and in https://groups.google.com/d/msg/pdfnet-webviewer/5Kn_Zob7MJc/BZrxjX8qAwAJ, I will take over this ticket and answer your questions.

1. Thank you for sending us your code. What's happening is that WebViewer does not normally allow annotations to be out of page bounds, so when you type the annotation is pushed to the left. However, when you let go, the original location of the text annotation is applied and thus it goes back to its original position.
I think a simple solution would be to do some calculation on mouseLeftUp of the free text tool so that your text annotation is never created off the bound. For example,

Tools.FreeTextCreateTool.prototype.mouseLeftUp = function(e) {
    var annotManager = docViewer.getAnnotationManager();
    if (annotManager.getAnnotationByMouseEvent(e)) {
        this.annotation = null;
        mouseLeftUp.apply(this, arguments);
        return;
    }


    if (this.annotation) {
        var newWidth = 200;
        var newHeight = 100;



        var pageWidth = docViewer.getPageWidth(docViewer.getCurrentPage() - 1);
        if (this.annotation.X + 200 > pageWidth) {
          this.annotation.X = pageWidth - 200;

        }


        this.annotation.setRect(new Annotations.Rect(this.annotation.X, this.annotation.Y, this.annotation.X + newWidth, this.annotation.Y + newHeight));
        this.annotation.setPadding(new Annotations.Rect(0, 0, 0, 0));
    }


    mouseLeftUp.apply(this, arguments);
};

The other option is to reduce the annotation's width, which you can calculate using pageWidth and this.annotation.X

2. I was able to find some weird behaviors in FreeTextAnnotation. We recently introduced new auto-sizing text, and it could be related to that (it's only in iOS though, related to timing). I'll investigate more and let you know when I have a fully working version in iOS.

3. Thank you for reporting. It does sound weird that all buttons stopped working, which we never experienced before. We'll keep an eye on it, but if you come across the issue again could you check if there's any errors in the log?

Best regards,
Justin Jung

David Compton

unread,
May 23, 2019, 11:37:43 AM5/23/19
to PDFTron WebViewer on behalf of Justin Jung
Hi Justin,

Thanks for your suggestion re point number 1. That has fixed the problem.  I added in some similar code to deal with the annotation height.

I'll look forward to your solution to number 2.

Kind regards,

David

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/25a65f9b-4bee-4b05-ac5c-193e808c6dae%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--

Justin Jung

unread,
May 24, 2019, 5:24:01 PM5/24/19
to PDFTron WebViewer
Hi David,

Summarizing the remaining problems:
#2 - Free text annotation not being unselected even when user switches out from the tool
#4 - Tool bar buttons become unresponsive when you navigate using page nav overlay on bottom left corner

I have been working on #2, and actually I observed some undesired behavior with free text annotation where the initial focusing of the text when I first create the annotation was not editable (the UI shows that the text is focused but typing in the keyboard doesn't actually change the text). I investigated further and found out that there is something going on in cordova which seems to have different timing than browsers, causing this issue.
I thought that free text annotation is one of a common tool for your users, so I'm still narrowing down the issue but the process is slow as I always have to build the project and test it on actual device (since I can't reproduce it anywhere else).
Once I fix it and make the free text annotation usable, then I will try to reproduce the problem you encountered.

Regarding #4, I wasn't able to reproduce it with the latest core and UI. I have a guess on what could be causing that. I experienced similar issue when playing around with free text annotation, and it seems like the device actually believes that you are still in a textarea, typing, but for some reason I cannot blur it by clicking off so I got stuck. But I could not reproduce that issue when I used page nav overlay so far.

I will keep you posted regarding the free text annotation.

Justin Jung

unread,
May 27, 2019, 6:50:40 PM5/27/19
to PDFTron WebViewer
Hi David,

I was able to come up with a fix for the unwanted behaviors that I was experiencing.
It would be very appreciated if you could try this out in your app, and let us know if it's any better/worse or same as before.

Also, I got more updates on your questions #2 and #4.

I was able to reproduce issue #2 in two specific scenarios:

1. When you are already in a pan tool, and you select the free text annotation and click on comment to change it, then click on the pan tool again
2. When you create new free text annotation, edit the content and click x on the header

In both cases, WebViewer is in free text editing mode, and from the user clicking either the pan tool or the x it will conceive it as a 'tap' event and dismiss the free text editing, then selecting the annotation for further operations.
The second scenario can easily be improved for your use case by adding the following code to your config.js:

docViewer.on('toolModeUpdated', function() {
  setTimeout(function() {
    docViewer.getAnnotationManager().deselectAllAnnotations();
  }, 0);
});

However, #1 is little bit tricker since the UI does not trigger a toolModeUpdated event for a tool that is already selected.
The only way to make #1 to deselect the free text annotation is to edit the UI source code, adding the following line to onClick function of ToolButton.js

core.deselectAllAnnotations();

Regarding issue #4, I still could not reproduce the problem you are facing. Are there specific steps to reproduce it reliably?
CoreControls.js.txt

David Compton

unread,
May 30, 2019, 6:21:18 PM5/30/19
to PDFTron WebViewer on behalf of Justin Jung
I'm now using the following build environment (it is getting a bit hard to keep my head around the different pieces):
I've also made the code changes that you suggested.

Anyway here is my feedback related to the free text annotations:

#2 - Free text annotation not being unselected even when user switches out from the tool:  
1. When you are already in a pan tool, and you select the free text annotation and click on comment to change it, then click on the pan tool again:  I applied your suggested fix but it did not seem to work.  This is probably a bit of an edge case so I'm not so concerned about this.
2. When you create new free text annotation, edit the content and click x on the header: I'm not sure what you mean by "click x on the header"  - do you just mean tapping somewhere else in the document?

Anyway tapping the pan tool, after creating a free text annotation now works as expected.  Also the selection of the initial text now seems to work much better - I had also noticed some unstable behavior in this regard. 

#4 - Tool bar buttons become unresponsive when you navigate using page nav overlay on bottom left corner  
Regarding issue #4, I still could not reproduce the problem you are facing. Are there specific steps to reproduce it reliably?  
  • Open a document, tap on the page number and change pages.  Toolbar buttons still work as normal.
  • Tap on the page number a second time and change pages.  Toolbar buttons no longer work.
I noticed after doing this that the cursor was still flashing in the page number area - but about "two lines" higher than the actual page number box.  This only occurs after the second time you select a page.  So what I think is happening is that somehow the virtual keyboard and/or undo/redo/paste toolbar is causing the cursor to lose its correct position on the page.  It is a bit higher than it actually should be - so I guess when you tap on the buttons they are not receiving the touch event because everything is out of whack.  I noticed some similar behavior related to the free text annotation when I was testing that, but I cannot seem to replicate that now.

Also what is the expected behavior in relation to adding multiple free text annotations.  The only way that I can reliably do it is to click the pan button after finishing one free text annotation and then click the free text annotation button again - is that the way it should work?

Kind regards,

David



--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/33790e84-4b0b-4519-8994-609a16f438e7%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--

Justin Jung

unread,
May 31, 2019, 4:05:18 PM5/31/19
to PDFTron WebViewer
Hi David,

Thank you for providing the information.
5.1 release will include all the fixes for problems you have faced, and you won't have to worry about various different versions of files.

#2 - It sounds like you saw improvement, but also a new unstable behavior? Could you elaborate what the behavior is and steps to reproduce it?
#4 - I'm still having trouble reproducing the issue. I was testing with iPad and iPad mini. Does the issue occur on all of your devices?

To create multiple free text annotations, you shouldn't need to switch back to the pan tool each time. For example,
1. Click on free text tool
2. Tap on a document to create
3. Edit the text
4. Close the virtual keyboard with the dismiss button (see image attached)
5. Repeat from step 2

Best Regards,
Screen Shot 2019-05-31 at 12.42.57 PM.png

David Compton

unread,
Jun 4, 2019, 1:15:22 PM6/4/19
to PDFTron WebViewer on behalf of Justin Jung
Hi Justin,

#2 - Sorry for the confusion, I didn't mean any new unstable behavior.  I meant that I had experienced the behavior that you described.
#4 - I get it on my iPad Pro (9.7 inch).  Have not tried on any other devices.  I'll ask a colleague to try and let you know if it is any different.

Multiple free text annotations:  I can replicate the behavior that you detailed when using the onscreen keyboard, however if you try it with a physical keyboard attached, which a lot of our customers use, then it does not work unless you click the pan tool.  

Kind regards,

David

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/533db9a0-2298-4c23-9f4b-d32f052dca16%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--

David Compton

unread,
Jun 5, 2019, 6:32:51 PM6/5/19
to PDFTron WebViewer on behalf of Justin Jung
#4 I have confirmed that exactly the same problem happens on my colleagues iPad.  Both are the same model A1673, which is the 9.7 inch iPad Pro from a couple of years ago.  I have taken a video of the problem:  https://www.dropbox.com/s/cytfldvqny3od4u/GVLN0576%5B1%5D.MP4?dl=0

In the video am using the build provided by Matt: WebViewer_5.0.0.70872 - in this case the problem happens even after only using the page number control to change pages once.  If I swap in the corecontrol.js file that you provided earlier in this thread then the problem still occurs.

Kind regards,

David
--

Justin Jung

unread,
Jun 6, 2019, 3:36:23 PM6/6/19
to PDFTron WebViewer
Hi David,

Thank you for sending the video.
From the observation, it looks like the blur event is not occurring on the page nav input and somehow the mismatch between the actual DOM and what's visible to users gets introduced.
I did a quick search on the issue, and seems like it's a bug that has been around for quite a long time: https://github.com/ionic-team/ionic/issues/5020#issuecomment-358636139
To work around the issue, I have tried manually triggering a blur event on the input element when user clicks on document container as follows:

// in config.js
document.querySelector('[data-element=documentContainer]').addEventListener('click', function() {
  if (document.activeElement || document.activeElement.tagName === 'INPUT') {
    document.activeElement.blur();
  }
});

Please let me know how this works for you.

David Compton

unread,
Jun 6, 2019, 7:25:04 PM6/6/19
to PDFTron WebViewer on behalf of Justin Jung
Hi Justin,

Thanks for your suggestion.

As it turned out the problem was related to Cordova/Ionic.  It was that when trying to resolve some build issues about 6 weeks ago, I had inadvertently added an old keyboard plugin "cordova-plugin-keyboard" (as well as the correct plugin "cordova-plugin-ionic-keyboard").  When I removed this plugin the problem went away.  My apologies for wasting your time on this one.  

Kind regards,

David

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/1dbb0651-fa4b-4e34-a4cc-1644e13bff53%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--

David Compton

unread,
Jun 6, 2019, 7:25:04 PM6/6/19
to PDFTron WebViewer on behalf of Justin Jung
Hi Justin,

With regard to this page number navigation issue - I've rolled back the web viewer code to where it was on an earlier version of our app that did not have the problem (this corresponds with the current production release of our app for iOS).  And the page number problem still occurs.  So unless I'm missing something that means the problem is in something else that has changed outside of the web viewer code - but I cannot work out what it can be - unless it is to do with an Ionic plugin or something.  Anyway I guess I will just have to use a process of elimination and roll back to each commit in our code that has happened in between times until I can find when the problem started occurring.  The problem, as you know, is that it is very time consuming building for iOS, deploying to device and then testing.  

Let me know if you have any thoughts when you view the video and see the problem.

Regards,

David
--

Justin Jung

unread,
Jun 6, 2019, 7:33:17 PM6/6/19
to PDFTron WebViewer
Hi David,

Thank you for your update.
We were not able to reproduce the page nav issue on any of our devices, so it would be great if you can narrow down the changes that broke it.
If you find out that the breaking change was WebViewer update, could you send us the WebViewer code (CoreControls, webviewer.min.js, webviewer-ui.min.js, etc) for the version that broke it and the version used right before it?

David Compton

unread,
Jun 10, 2019, 2:11:29 PM6/10/19
to PDFTron WebViewer on behalf of Justin Jung
I think our email replies have crossed - I sent an email with my resolution about an hour ago.

Kind regards,

David

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/6f23a6be-3451-4cc9-b009-fd5f35687fdb%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--

Justin Jung

unread,
Jun 10, 2019, 6:08:45 PM6/10/19
to PDFTron WebViewer
Hi David,

I don't see an email or reply with your resolution.
Could you re-send it once more?

David Compton

unread,
Jun 11, 2019, 12:53:46 PM6/11/19
to PDFTron WebViewer on behalf of Justin Jung
Hi Justin,

Reposted:

As it turned out the problem was related to Cordova/Ionic.  It was that when trying to resolve some build issues about 6 weeks ago, I had inadvertently added an old keyboard plugin "cordova-plugin-keyboard" (as well as the correct plugin "cordova-plugin-ionic-keyboard").  When I removed this plugin the problem went away.  My apologies for wasting your time on this one.   

Kind regards,

David 

--
You received this message because you are subscribed to the Google Groups "PDFTron WebViewer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pdfnet-webview...@googlegroups.com.
To post to this group, send email to pdfnet-w...@googlegroups.com.
Visit this group at https://groups.google.com/group/pdfnet-webviewer.
To view this discussion on the web visit https://groups.google.com/d/msgid/pdfnet-webviewer/b56a6ced-d3db-4abd-ae45-7d7ad60703f5%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--
Reply all
Reply to author
Forward
0 new messages