flexpaper

FlexPaper 2.2.8 Release Notes

We have started rolling out version 2.2.8 today. We will first be updating our classic and annotations viewer and will be updating the zine viewer in the next few days.

How to update:
This release does not require you to republish any of your documents so if you want to install the update without republishing your documents then simply copy and replace the following resources from the distribution file that you are using:

  • FlexPaperViewer.swf
  • js/ (directory)
  • css/ (directory)


Significant changes in this release:

  • Fixed an issue related to twitter modal windows conflicting with the modal window rule in flexpaper.css

  • Ability to disable and enable page shadows in Zine publications added to desktop publisher for both Flash and HTML5

  • Fixed an issue where the Reply button wasn’t initially fully visible in flash mode when using collaborative annotations for some zoom levels

  • Fixed an issue where the tooltip wasn’t correct when using the flash annotations viewer in collaboration mode

  • Fixed an issue where printing the current page in flash mode would hide the annotations after completion

  • Fixed an issue where the reply button would be visible in print when using collaborative annotations in flash mode

  • Improved publishing speed in desktop publisher

  • Fixed an issue where minimising an empty annotation in flash mode would cause an incorrect dialog to appear about deleting the annotation

  • Performance adjustments for desktop Safari on OSX (HTML5 mode)

  • Improved mouse wheel scrolling support for FireFox and fixed an issue where mouse wheel scrolling in Chrome version 36 and higher would cause the viewer to get out of position

  • Corrected an issue where the drawing cursors were not enabled in the annotations viewer for MSIE 10 and higher

  • New method: refreshMarks method to the annotations viewer. Refreshes all annotations on all visible pages (accessed using $FlexPaper(‘documentViewer’).refreshMarks())

  • Printed range added to the onDocumentPrinted event

  • Fixed an issue where differently sized pages would not load properly in HTML5 single file mode

  • Fixed an issue where the drawing color wasn’t being set properly in the annotations viewer when using sticky mode

  • Fixed an issue where the annotations viewer was not including note property properly in onMarkCreated and onMarkChanged events for some scenarios

  • Fixed an issue where the android soft keyboard was not hiding properly when leaving focus on text notes in the annotations viewer

How to create a page flip publication on PC

 I have previously blogged on how to publish your digital publication on a Mac. This week I will focus on how you turn your PDF to an online publication using FlexPaper desktop publisher on a PC.

The only real difference between publishing your document online using FlexPaper on a PC compared to a Mac is the setup of Flexpaper on your computer.

Start by download the installation files for FlexPaper Desktop Publisher.You can find the file here

image

Start the setup then tick the terms and conditions box and click the install button. The installation script will start and within one minute your configuration is finished and you are ready to go.

image

Yep, that’s how easy it is!

The first time you save an edited digital publication, FlexPaper will create a folder in your documents folder. FlexPaper then saves your publication every time you hit the publish button. The automatically saved publication can be found in the same folder under a subfolder with a corresponding name as your PDF document name. 

I want to finish of with a few words on what I have done on this example blow (just click the image to open the example in full). I have chosen a recipe publication as I love cooking myself and this publication example is packed with mouthwatering creations.

image

(click on image for a live example)

 - I customised the background to tie in with the publication. FlexPaper will proportionally stretch you image to fit your background no matter what the device you are viewing the publication in, just make sure you tick the option box when you are importing the image. 

- I customised the toolbar color with a nice contrasting black. 

-  I added a social sharing link to one of the recipes because it was too good not to. The social sharing option does come as default in the toolbar menu so make sure you activate the button under the toolbar menu if you want to add this feature. 

Happy cooking

Camilla

FlexPaper team

This week’s Q&A snapshot

Question : How can i display the converted PDF-documents in Browser?

Answer : Looks like something isn’t right in the conversion - perhaps a permission problem. Are you hosting this on a Windows or Linux server? We typically recommend the ASP.NET scriptsi on Windows and the PHP scripts on Linux. Contact us via email and we’ll help you investigate further



Question : Display One Page at a time - forceSinglePage

Answer : Have a look at this Q&A post:
http://devaldi.com/FlexPaper_QnA/?qa=762/one-page-flipping-mode-mobile-on-desktop&show=776#a776

The same syntax as described for the <mobile> element can be applied to the <desktop><general> element from version 2.2.7



Question : Can you link directly to a single page in a multi-page PDF?

Answer : yes absolutely. You can use our API like so: $FlexPaper(‘documentViewer’).gotoPage(55) or using a config file if you use our desktop publisher for Zine.



Question : PDF with Landscape and Portrait

Answer : You can run mixed size pages in portrait mode but the two page flip mode only allows one size of pages (otherwise some pages would be too small to be clearly visible and in other cases too large to fit the viewer)



Question : TypeError: $(…).FlexPaperViewer is not a function

Answer : Looks like not all javascript files were included after all- feel free to send us a url via email and we can help you have a look



Question : Are page up and page down supported in split mode?

Answer : yes it is supported accross the modes



Question : Customising UI toolbar

Answer : You can download our customizable version from our commercial download area. It allows the toolbars to be fully customized using CSS and HTML.



Question : Is there any way to get current zoom level or scale value?

Answer : We don’t have any API method for this unfortunately but may be able to add this for you. Contact us via email for a follow up



How to print content of the viewer form using outside print function ?

Answer :

Hi

  I am use Master page for one aspx page,in that i use iframe,in that iframe i call the flex viewer page,so how to print content of the flexviewer .Below is my code how get the flex viewer id in javascript

First i have master page for aspx in that i use iframe so here i get iframe id first 

  var vframe = document.getElementById(“ContentPlaceHolder1_viewframe”);

Here flex  viewer id ,documentViewer is my flex paper id

  var flx = vframe.contentWindow.document.getElementById(“documentViewer”);

And file i try for print in follwing ways

   flx.printPaper(‘current’);
or
    $FlexPaper(‘documentViewer’).printPaper(‘current’);
or
 flx.printPaper();
 
None of these above work,so pls tell me how to print viewer content form our own button click event in javascript.
 
Note: i am use master page and iframe,in iframe i call flex viewer page.
if i try to print form without master page and use this line in javascript can print 
    $FlexPaper(‘documentViewer’).printPaper();
 
Regards
   Aravind



Question : Wordpress Integration - how to open Flexpaper in new Window?

Answer : There is no such option unfortunately - we may be able to help you further via email or incorporate this as a parameter to the viewer. Contact us at info@devaldi.com for further discussion



This weeks summary of questions and answers

Question : Wordpress Integration - how to open Flexpaper in new Window?

Answer : There is no such option unfortunately - we may be able to help you further via email or incorporate this as a parameter to the viewer. Contact us at info@devaldi.com for further discussion



Question : Does FlexPaper have any Ruby bindings?

Answer : We have some samples ready for Ruby but we have not yet updated these to be fully compatible with our latest build, we’re happy to send these to you though. Contact us via email and we’ll send you the samples



Question : How to remove print,download button individually in viewer for html ?

Answer : You either have to download the read only package (from our commercial download area) if you want to use our web server package or you have to tick the “Read Only” option in our desktop publisher



Question : Are there any keyboard shortcuts for the online document viewer?

Answer : Yes our classic viewer supporst page up, page down and both our viewers support left and right navigation using the keyboard arrows



Question : How can I had a logo in the top of the page?

Answer : You can add a custom button which has your logo as graphics. Search for custom button in this Q&A and you will find multiple answers to this



Question : Define PDF Url for each page?

Answer : Not at the moment unfortunately, I am not even sure how that would be specified, perhaps with a array of urls to each page?



Question : annotation: double or dribble click on text

Answer : Double clicking could absolutely be added - I have added this to our feature request list - follow up via mail for a new build!



Question : Flexpaper cross domain support is not working using the latest version.

Answer : Have a look at this answer:

http://devaldi.com/FlexPaper_QnA/?qa=470/im-not-able-to-load-a-file-from-amazon-s3



Question : Does Flexpaper support Internet explorer 8?

Answer : FlexPaper supports IE8 but you will need to supply the IMGFiles parameter and the JSONFile parameter to the viewer to support lower versions of IE. You can find a browser compatibility page in our documenation



Question : Pre-generate data from batch file

Answer : Have a look at our documentation and you will find how to manually convert to these formats. You can easily create batch scripts with the commands we recommend for each format.



This weeks summary of questions and answers

Question : publish 100 pdf files as html5

Answer : No need to convert anything if you just want to publish them in HTML5 mode. We render to html5 directly from a PDF file. If you want to convert to html4 or flash in a batch then I recommend having a look at the “manual conversion” documentation section in our docs



Question : can we delete print and copy action in zine with commercial license?

Answer : Yes you can, all our commercial clients are given access to a read only build in where copy and print has been disabled



Question : How do I add a custom element and download link to my publication?

Answer : The question around buttons has been answered before. Please see the following thread:
http://devaldi.com/FlexPaper_QnA/?qa=655/how-to-add-an-extra-button-in-flexpaper-zine

You can add a download link to the pdf document by ticking the download button inside desktop publisher (its right hand side)



Question : Can we use zine viewer unbranded?

Answer : You can indeed. The Zine viewer is unbranded when you are using a commercial license.



Question : gotoPage() API method

Answer : Not quite sure why it would do this - please forward the url you’re using to our email address (info@devaldi.com) and we’ll inspect further.



Question : Set custom urls for each page?

Answer : You can create custom urls for your pages if you use our desktop publisher for Zine. It defines a configuration file which can contain your own url’s. No need to know anything about javascript.



Question : Only one zoom level? Not enough for phone/tablet.

Answer : You can add further zoom levels by expanding the advanced settings in the publishing dialog in desktop publisher and ticking the “Optimize publication for low memory / CPU devices using PHP”. This will add further depth to the zoom.



Question : Is it possible to disable mousewheel zoom?

Answer : I’m afraid this is not currently possible. We have added this as a enhancement request



Question : Why won’t the folder with my flexpaper document appear in Filezilla?

Answer : Not sure why it wouldn’t show up in FileZilla - perhaps you can post a few screenshots of what it looks like? The folder has no special attributes so it should show up fine



Question : gotoPage() API method

Answer : Its probably better to place the gotoPage call in the “onDocumentLoaded” event handler as opposed to the onPageLoaded event handler. A reason for this is that if you load the document in two page mode then the viewer may trigger that it has navigated to page 9 if that is the left hand side of the page even if you are triggering gotoPage for page 10, so this could confuse things for your script.



FlexPaper 2.2.7 Release Notes

We have started rolling out version 2.2.7 today. We will first be updating our classic and annotations viewer and will be updating the zine viewer early next week.


How to update:
This release does not require you to republish any of your documents so if you want to install the update without republishing your documents then simply copy and replace the following resources from the distribution file that you are using:

  • FlexPaperViewer.swf
  • js/ (directory)
  • css/ (directory)


Changes in this release:

  • Regression issue fixed where the viewer wouldn’t download the full publication in some scenarios even if provided (Zine)

  • Issue fixed where the hide/show annotations were not calling hide/show properly in the customizable annotations build

  • 'forceSinglePage' will now work on desktop as well as mobile mode of the html5 viewer. Please note that the bottom thumb nails will not be visible with this turned on.

  • FlexPaper classic flash version will now use the supplied JSON file (if any) to generate links with better accuracy. It will also precache JSON files to improve search speed

  • Correction where onCurrentPageChanged didn’t fire properly on touch based devices when using the page number input box

  • Further checks added to next() and previous() in the HTML5 viewer to avoid spamming with events

  • Corrected an error related to displayFormat not being set properly when creating associative annotations

  • Improved checks for avoiding asp.net to fork too many processes in split mode

  • Improved the ability for Safari on desktop to zoom using transform scale in HTML5

  • The aspnet package for our annotations viewer has been updated and a few issues fixed

  • Alternative export option added for images in desktop publisher. It uses the SWF file format to export to PNG. Enable it under the conversion settings in desktop publisher

  • onPageLoaded event added to the HTML5 viewer

  • Improved responsiveness to the toolbar in the annotations viewer for small touch devices (such as the iPhone)

  • Issue fixed where IE10 and below would draw associative lines in HTML5 mode for the annotations viewer incorrectly

  • Fixed an issue where onMarkDeleted was not triggered when using the api for the HTML5 annotations viewer

  • Further checks added for new annotation marks being added to the HTML5 viewer in order to avoid duplicates in very specific scenarios

  • Added a missing swfsize query script for our ASP.NET annotations set up package

  • Fixed an issue where the HTML5 viewer would return the note in note marks as a XML object as opposed to a string when using collaborative mode

  • Fixed an issue where some annotations would not update properly in HTML5 mode when using the ASP.NET sample scripts

  • Fixed an issue where collaborative annotations were not recreated properly in HTML5 mode for some server side scripts

  • Fixed an issue where marks in collaboration mode would sometimes cause a jQuery error to be thrown

  • Improved sharpness of HTML5 rendering in both Classic and Zine

  • HTML5 rendering routine updated (version 1.0.441 build #0ac8380)

  • Issue related to using odd number of backslash characters in flash mode of our annotations viewer fixed

  • Issue related to the print and cancel print button of our html5 viewer fixed where it would cause incorrect navigation in some scenarios

  • Issue fixed where StartAtPage was not passed through properly in the Flash customisable classic viewer for some scenarios

This weeks summary of questions and answers

Question : Looks like the pdf is not correctly loaded

Answer : We’re getting a 403 when trying to access that url. Please contact us via email and we’ll help you set this up



Question : Why if we have file name with “+” not show in flexviewer ?

Answer : Thanks for raising this. It could be that the “+” sign is incompatible with some of our server side scripts. I have reported this to be fixed



Question : Are there any vb.net examples?

Answer : I’m afraid we don’t have any vb.net examples at the moment. If you want to use the asp.net package then you only need to include the “aspnet” folder in your application. No other directories or files from the FlexPaper distribution file are needed.



Question : Why do I get this message (see below) when I attempt to download the desktop publisher I purchased?

Answer : That sounds odd - from where are you downloading the desktop publisher?

Please use on of the URLs from our download page or from within the commercial download area



Question : Is it possible to use the pdf viewer with phonegap?

Answer :

Yes you can use our HTML5 viewers to load PDF documents in a offline scenario such as a PhoneGap application. The sample belows shows how you can load documents from a Uint8Array. 

<!doctype html>
<html>
<head>
    <title>Form Uint8Array</title>
    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8” />
    <meta name=”viewport” content=”initial-scale=1,user-scalable=0,maximum-scale=1,width=device-width” />
 
    <style type=”text/css” media=”screen”>
        html, body { height:100%; }
        body { margin:0; padding:0; overflow:auto; }
        #flashContent { display:none; }
    </style>
 
    <link rel=”stylesheet” type=”text/css” href=”css/flexpaper.css” />
    <script type=”text/javascript” src=”js/jquery.min.js”></script>
    <script type=”text/javascript” src=”js/jquery.extensions.min.js”></script>
    <script type=”text/javascript” src=”js/flexpaper.js”></script>
    <script type=”text/javascript” src=”js/flexpaper_handlers.js”></script>
 
    <script>
        function openFileDialog(evt){
            var files = evt.target.files;
            if (!files || files.length === 0)
                return;
 
            // Read the local file into a Uint8Array.
            var fileReader = new FileReader();
            fileReader.onload = function openFileChangeHandler(evt) {
                var buffer = evt.target.result;
                var uint8Array = new Uint8Array(buffer);
 
                $(‘#documentViewer’).show();
                $(‘#documentViewer’).FlexPaperViewer(
                        { config : {
                            PDFFile : uint8Array
                        }});
 
            };
 
            var file = files[0];
            fileReader.readAsArrayBuffer(file);
        }
    </script>
</head>
<body>
 
<input type=”file” onchange=”openFileDialog(event)” />
<div id=”documentViewer” class=”flexpaper_viewer” style=”position:relative;width:600px;height:500px;display:none”></div>
 
</body>
</html>



Question : I’m having problems getting FlexPaper working on mobile and tablet

Answer : Looks like you have not uploaded all the resources to your server. The server is missing the FlexPaperViewer.js file for example. Make sure all resources are uploaded and you will be fine



Question : Why isn’t the PDF2JSON installation working properly on CentOS?

Answer : hello

i have same problem

pdf2json is installed but it’s not detected in setup page

 

OS - Centos 6



Question : reload annotations.

Answer : Yes its possible in our upcoming 2.2.7 build - contact us via email for a prerelease



Question : UserCollaboration

Answer : I’m afraid it isn’t possible to restrict reply for certain users in the current build but we may be able to add this for you. Contact us via email and follow up



I upload all documents in CRM. Could i use flexpaper with CRM.

Answer :



This weeks summary of questions and answers

Question : reload annotations.

Answer : Yes its possible in our upcoming 2.2.7 build - contact us via email for a prerelease



Question : UserCollaboration

Answer : I’m afraid it isn’t possible to restrict reply for certain users in the current build but we may be able to add this for you. Contact us via email and follow up



Question : Last Page blank or shifts funny.

Answer : Thats sounds odd - could be the conversion that has gone wrong for this document, how are you converting it? feel free to send us a url via email where this can be seen and we can have a look at your configuration



Question : Does this WP plugin have the same features as the paid version that has the HTML5 demo?

Answer : If you use the wordpress plugin together with one of our commercial packages then yes it can show documents like in our demos



Question : FlexPaper won’t start in “Portrait” mode on mobile devices

Answer : Which of our viewers are you using? That should work fine if you are using Zine for example. Feel free to send us a url via email where you have deployed the viewer and we can have a look at your configuration.



Question : Creating the annotations database. I am having trouble with provided mdf

Answer : When set up completes, it runes a small SQL script that creates a mark table on your database. If this table is missing then that suggests that the user you used may not have had the permissions to create the table. You can see the table definition inside the setup.aspx.cs file.

If you can’t get this to work then contact us via email and we’ll guide you through



Question : Is it possible to disable print but allow copy

Answer : You could remove the print button from the toolbar in the desktop publisher. Text will still be copyable as long as you don’t tick the “Read only” mode.



Question : Mobile: Two-Page-View in portrait mode of a phone

Answer :

You can force any touch device to start at a certain view mode by supplying the following parameter:

TouchInitViewMode       : ‘TwoPage’,



Question : Is it possible to showing the user who has created an annotation in the annotations viewer?

Answer :

Yes! It is possible, we added this functionality to the build we released in may. Set the following parameters when starting the annotations viewer to enable this:

{
..

UserCollaboration       : true,
CurrentUser             : ‘Erik’,
..
}



Question : Is it possible to disable toolbars on the top and bottom?

Answer : Yes it is indeed possible, all our commercial license holders get access to a build in where the user interface is fully customizable and all buttons can be removed or new ones added.



This weeks summary of questions and answers

Question : Is it possible to disable print but allow copy

Answer : You could remove the print button from the toolbar in the desktop publisher. Text will still be copyable as long as you don’t tick the “Read only” mode.



Question : Mobile: Two-Page-View in portrait mode of a phone

Answer :

You can force any touch device to start at a certain view mode by supplying the following parameter:

TouchInitViewMode       : ‘TwoPage’,



Question : Is it possible to showing the user who has created an annotation in the annotations viewer?

Answer :

Yes! It is possible, we added this functionality to the build we released in may. Set the following parameters when starting the annotations viewer to enable this:

{
..

UserCollaboration       : true,
CurrentUser             : ‘Erik’,
..
}



Question : Is it possible to disable toolbars on the top and bottom?

Answer : Yes it is indeed possible, all our commercial license holders get access to a build in where the user interface is fully customizable and all buttons can be removed or new ones added.



Question : Accessing FlexPaper functions through an iFrame

Answer : May be a security restriction imposed by you from the browser that prevents this. Feel free to send us a url via email and we can investigate further



Question : Get currently selected text with FlexPaper API?

Answer : We don’t have any such method exposed at the moment but we may very well be able to add this for you. Contact us via email for a follow up



Question : How do I safely unload the viewer?

Answer :

Please use the dispose method to do this. Like so:

$FlexPaper(‘documentViewer’).dispose();



Question : Where do I put the license key?

Answer :

You either enter the license key into desktop publisher (if thats what you’re using) and desktop publisher will set it for you automatically as part of the publishing process

or

You set it manually by populating the key parameter in javascript where the viewer is getting created like so:

        $(‘#documentViewer’).FlexPaperViewer(
                { config : {
                …
                key : “$YOUR_KEY”,               
                …

                }}
        );

This weeks summary of questions and answers

Question : after clicking on “publish & view”, i can’t view in browser or mobile preview

Answer : Could be that you have a local firewall that is blocking the application from showing the preview, are you getting any other warnings ? And this is the same with all documents you tried?



Question : Unable to upload pdf

Answer : Please contact us via email with a link to where you have deployed the viewer and we will have a look at your configuration (info@devaldi.com)



Question : Can the software be used to create a stand alone HTML4 and HTML5 version of the PDF ?

Answer : Yes you can load a these resources stand alone without being connected. Contact us for a code sample on how to do this



Question : Is it possible to add a “previous page” control to the FlexPaper toolbar?

Answer :

We don’t have any implementation for managing browser history built into the viewer but this is not hard to add since FlexPaper is a jQuery plugin. See the following link for suggestions on the best javascript history plugins

http://stackoverflow.com/questions/116446/what-is-the-best-back-button-jquery-plugin

Simply call the $FlexPaper(‘documentViewer’).nextPage() and $FlexPaper(‘documentViewer’).prevPage() on navigation



Question : Fullscreen in iframe issue and loading performance issue

Answer :

Set the “allowFullScreen” attribute to true on your iframe tag if you want the viewer to be able to go into fullscreen from your iframe. See the code snippet below for an example on this:

<iframe style=”border: 0px;” frameborder=”0” height=”400” width=”500” name=”content_frame” id=”content_frame” src=”document.html” allowFullScreen>
    Your browser does not support IFrames.
</iframe>



Question : Preserving book marks.

Answer : We don’t have this as part of our current build but we have ongoing discussions around adding this and we can provide you with examples of how to create your own bookmarks if you want to - contact us via email for details on this



Question : ThumbIMGFiles issue

Answer : Not quite sure what you mean but you can indeed load the viewer without setting this parameter. If the parameter isn’t set then FlexPaper will render them on the fly



Question : ASP.NET MVC 4 Supported?

Answer : Yes, but we don’t have any out of the box examples of this. Feel free to contact us via email with your code samples and we can discuss with you.



Question : Zine Flip Mode - Zoom Stuck at 100%

Answer : Hard to know whats going on without looking at your document - send us a link to where you have published your document and we’ll have a look for you (to info@devaldi.com)



Question : Fullscreen mode onload

Answer : You can’t load flexpaper in fullscreen on load, your options are to use the PreviewMode and set it to “Miniature” or “FrontPage”