flexpaper

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”



This weeks summary of Questions and Answers

change to fullscreen on document click
Posted on Tuesday June 10, 2014

You can set the PreviewMode parameter to “Miniature” if you want the publication to be opened in full screen when clicked.



HTML5 API.highlight
Posted on Tuesday June 10, 2014

We have added this function to our HTML5 viewer as well. Its available from version 2.2.5



Customized Thumbnail
Posted on Tuesday June 10, 2014

Thanks for your feedback ! Unfortunately not possible in the current version of FlexPaper



Fullscreen button missing on mobile and tablet devices
Posted on Tuesday June 10, 2014

The full screen button is not visible per default to the mobile devices. You can make it visible by opening the UIConfig file that desktop publisher has produced for you (the .XML file) in a text editor and look for the following:

<element type=”button” id=”bttnFullScreen” icon_height=”39” icon_width=”39” visible=”false”/>

The “visible” attribute should be set to true for mobile if you want this icon visible, so simply change it to:

<element type=”button” id=”bttnFullScreen” icon_height=”39” icon_width=”39” visible=”true”/>

and you should be fine.



Toolbar show/hide functionality.
Posted on Tuesday June 10, 2014

The Zine viewer has its toolbars defined in the UI_Config file. The easiest way of customizing this file is to import your pdf file into desktop publisher and publish your document from there. This will produce a UIConfig file (a XML file) for you that you can then copy over to your web application



Hello, installed the program. Not what I expected, how do I uninstall it?
Posted on Tuesday June 10, 2014

If you installed it in Windows then simply use the “Add/Remove programs” in your control panel. In Mac OSX you simply delete it from your Application folder.



How do I allow users to download original pdf using download button?
Posted on Tuesday June 10, 2014

We had an issue in some of our builds causing the file not to be downloadable as a single even if this was selected as a setting. You can fix this by editing the index.html file that desktop publisher produces for you and change the following:to

PDFFile : ‘docs/Paper_[*,2].pdf’,
to
PDFFile : ‘docs/Paper_[*,2,true].pdf’,
 
The document name will be different in your case, the important change here is the “true” part that I have marked in bold for you.



Mistake in Finnish toolbar tooltip
Posted on Tuesday June 10, 2014

Thank you for these corrections!

The flash viewer has these translations compiled into the swf file. We can send you an updated build with these changes in if you contact us via email (so you don’t have to wait until next release).



Is there a way to bookmark search results?
Posted on Tuesday June 10, 2014

No there isn’t any way to do this at the moment unfortunately. Feel free to send us an example of how you would want this to work and we may be able to add this to our next build for you (send it to info@devaldi.com)



Are there any size or page count restrictions?
Posted on Friday June 06, 2014

No such restrictions except for the Zine trial which is limited to show 10 pages.



This weeks summary of Questions and Answers

Doesn’t print the exact width of the page (was like 60%)
Posted on Thursday June 05, 2014

Perhaps you used margins in your browser print set up dialog which are cutting into the print? You can also try to set the AutoAdjustPrintSize parameter on the viewer:

AutoAdjustPrintSize : true,



Is there a plugin to implement FlexPaper Zine on Drupal 7 ?
Posted on Thursday June 05, 2014

Yes there is but we do not manage that plug-in project. You can find it on the url below:

https://drupal.org/project/flexpaper



we have purchased Flexpaper, preview is displaying fine but tool bar is not displaying.
Posted on Thursday June 05, 2014

Perhaps you are using our customizable build but have not included the toolbar files (UI_flexpaper_desktop.html and UI_flexpaper_mobile.html)?



In the answer above, you mention “in HTML mode” and “in flash mode”; does the same approach work in HTML5 mode?
Posted on Thursday June 05, 2014

It could be that the server you are loading the PDF from doesn’t support CORS. Contact us via email and we can help you investigate this



How to hide print button which appears after right click on flash page ?
Posted on Thursday June 05, 2014

This option will not be there if you use our read only build from our commercial download area



Some images not rendering a high resolution but others are?
Posted on Thursday June 05, 2014

That sounds a bit odd - contact us via email (info@devaldi.com) and we will have a look at your configuration. Make sure you include an url to where you have published your document.



would it work if user doesnt have adobe
Posted on Thursday June 05, 2014

Yes we have HTML4 and HTML5 modes that do not require any Adobe products (like flash or acrobat reader) to be installed



Problem loading pdf through PHP publishing
Posted on Thursday June 05, 2014

Yes if you have set flash to be your display format then there should be swf files in your working directory. If you’re not getting any of these then your SwfTools installation is most likely not working as it should.

Windows has a few quirks in using PHP and allowing external applications such as SwfTools to run so I would really recommend setting things up in Linux as opposed to windows to make things easier for you.



extra information property of mark class for “note” annotation
Posted on Thursday June 05, 2014

We have added the possibility to supply a User to our latest annotations build. See our latest release notes for info on this:

http://blog.flexpaper.org/post/87529085498/flexpaper-2-2-6-release-notes



Flexpaper marker color property is not working in HTML 5
Posted on Thursday June 05, 2014

Change the “type” to “highlight” from “strikeout” and you should be fine



FlexPaper 2.2.6 Release Notes

We have started rolling out version 2.2.6 today. This version contains new enhancements for collaborations to our annotations viewer, a few enhancements for our flip book viewer and minor bug fixes.

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:

  • HTML5 rendering routine updated (1.0.117 build #6a800eb)

  • Issue fixed where the mouse wheel handler for flexpaper classic in flash mode caused repositioning issues

  • Small corrections to the flat design of the annotations viewer

  • It is now possible to adjust the flip speed for the page transition in FlexPaper Zine from desktop publisher (under Publication Settings)

  • Issue corrected where cancelling the print dialog didn’t cancel the print when printing in flash using split mode

  • Issue corrected where it wasn’t possible to select existing selection annotations in certain scenarios

  • The annotations viewer in flash mode now adjusts the font size of notes so that they are always readable even when zooming out

  • Our annotations viewer now supports collaborative notes. Setting the following parameters enables collaboration between users in notes
    {
    UserCollaboration : true,
    CurrentUser : ‘Username’
    }

  • Issue fixed where printing using flash in some browsers caused the print dialog to stay after the print completed

  • Issue fixed where the viewer would not resize to fill screen in full screen mode when using the FlexPaper classic customizable build

  • Issue fixed where FlexPaper would steal focus incorrectly in IE11 and below

  • PHP scripts updated to use readfile for binary files to avoid encoding issues for certain environments

  • Fixed an issue where some annotations with associations were not deleting their associated objects properly in flash mode

  • Added extra visibilty for the scrollbar in webkit

How to use your Mac to turn a PDF into a online digital publication

Today I want to focus on the A to Z on how to install and publish your digital documents online using a Mac computer. For this demo I have selected a product catalogue to demonstrate a few of the customisation possibilities FlexPaper offers. 


I have used FlexPaper Desktop publisher to do all the customisations in this publication. Click on the screenshot below if you want to jump straight to the live demo.
image

 

  
1. Getting started:
Once you have opened the desktop publisher, use the open PDF button to browse through your files. Select the PDF you want to publish and click the open button.

If you already have a PDF that you previously worked on that you want to edit, open the original then press the “import settings from previous publication” and browse through to the folder where you have previously published your document. Select the folder and click open and the desktop publisher will import any previous settings. 



2. Technical features:

image


Decide what technical features the PDF need. The left hand section in the publisher is where the unseen user experience gets decided and other behind the scenes goodies like Google analytics tracking.

Because the features I have added to this demo are on page 8-9, I have selected this to be my start page. 

I have also chosen to select HTML5 as primary format with a fall back to flash if the device my PDF is displayed on doesn’t support HTML5. 

To learn more about browser coverage for HTML5 and flash, click here:
http://flexpaper.devaldi.com/html-flash-or-html5.jsp



3. End user and visual features:

image

On the right hand side in the publisher you enhance the visual and end user elements. I added a product video to emphasise features for one of the products. I have also added a special prize image on top of one of the products with a link that takes the reader to the website product page. I added another link to the same page on the website on top of the product heading. 


To emphasise my brand even more I have created a background image that ties in with both the brand and the product catalogue. 



4. Preview and Save:

image

Now that I am happy with my document I click the Publish and View button. Once you click the publish button, the document is converted and a folder is created in the FlexPaper folder in your documents folder on the Mac. The folder created will have the same name as your original PDF.

Upload to the web:

So, now it is time upload your document onto your website or blog. You will need to upload all the content in the folder that FlexPaper has created to your server. There are various ways to upload content to a web site. Some hosting solutions allow content to be uploaded through a guide and others require you to use a tool like FileZilla to upload your content via FTP. If you are unsure of how to use FileZilla and what FTP is then I recommend having a look at a tutorial at youtube for how to use this free utility.

To finish this tutorial off I would like to have a quick recap. In here I have demonstrated how to customise technical and visual elements to the product catalogue PDF. I have added an image background that ties in with both brand and product catalogue. I finished the tutorial off with an explanation the final steps to publish your online publication.


The last tip I want to add in this post is that if you have access to the original PDF, you can add pages and publish an updated version of your product catalogue, add videos or prices specials, as you need them. No need to wait for the next print run to display your products.


Here is a link to more example documents to give you more inspiration on what you can do with your digital publication:
http://flexpaper.devaldi.com/demo/ 

Good luck,

Camilla

FlexPaper Team