New flat UI flip book design & new video features for HTML5 pdf document viewer

Tuesday 25th November 2014

New features on your favorite desktop publisher for publishing online documents includes Vimeo support, disable zoom and great performance improvement for Windows users.

With only a month to go for the Christmas Holidays you might have missed the highlights of the latest release of FlexPaper, version 2.3.0. Don’t worry, here’s a recap. 

We have added a flat material style icon set. This will give your publications a fresh contemporary look. Just select the template called material to access this new style icon set for your top menu bar in the desktop publisher.

 

A full demo of this new icon set will soon be available on our website, so watch this space. 

Vimeo is now available as a second video option to add to your digital publication. The feature is added to the desktop publisher, including the Zine and Classic viewers and it works in both Flash and HTML5 mode. To add your Vimeo video clip just add the link that Vimeo has created for you in the appropriate field in the desktop publisher.

Another new setting that has been added to the desktop publisher is the ability to disable the zoom function on your publications.  

FlexPaper has updated the graphical design for FlexPaper Zine and FlexPaper Classic and the updated artwork will gradually be changed during the coming months.

With the new big performance improvement with converting documents in Windows, you will experience a faster rendering time for your publications in desktop publisher. If you are a Mac user, don’t worry that you are losing out because the enhancements are already in place for ios.

 You do not need to update or republish any of your publications when you download and install the latest version of Flexpaper Desktop Publisher. If you want to republish your documents, simply copy and replace the following resources from the distribution file that you are using:

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

For a full set of new features read the latest release notes.

That’s all for now.

Cheers,
Camilla
FlexPaper Team

FlexPaper 2.3.0 Release Notes

Thursday 20th November 2014

We have started rolling out version 2.3.0 today. We will first be updating our zine viewer and will be updating the classic and annotations viewers 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 next / previous buttons getting disabled in certain scenarios under iOS

  • Improved annotations support in full screen mode for iOS8
  • Corrections to the HTML5 annotations viewer for loading differently sized pages in MixedMode
  • A number of minor UI corrections for search abstracts in HTML5 & HTML4 mode
  • Fixed an issue where links in iOS phone devices had their links truncated in certain scenarios
  • Fixed an issue where links in iOS devices caused the pages to blur when zooming in in some scenarios
  • Improvements for desktop Safari 7.1
  • Improvements in desktop publisher for OSX Yosemite
  • Ability to disable zooming into publications now added to Desktop Publisher
  • Retina support added for desktop publisher and default rendering mode switched to GPU
  • Artwork updated for our different viewers
  • Correction for Windows Phone where it wasn’t getting the correct user interface for Zine
  • Vimeo video support added to desktop publisher (Zine and Classic, both Flash and HTML5 mode)
  • New flat material style icon set for Zine! We hope you like it!
  • Issue fixed where links close to each other were not exported properly
  • Big performance improvement in converting documents on Windows for Destkop Publisher

This weeks summary of questions and answers

Wednesday 19th November 2014

Question : How can I add some custom branding to the viewer?

Answer : You can’t modify the content iself dynamically but you could modify our flexpaper.css files and overlay the viewer with your branding

Question : Not able to play content using cloudfront urls

Answer : Maybe consider using the HTML5 viewer (with HTML4 fallback) in this scenario?

Question : The license key does not match the domain you are using the viewer on

Answer : Contact us via email ([email protected]) and we’ll check your key against your acconut

Question : PDF not loading when published files moved to server

Answer : Sounds like your personal web server has problems delivering the .js files in the docs directory. Do you have php installed? PHP is needed if you have enabled password protection to the publication

Question : Obtaining offline licence

Answer : Contact us after purchasing your license from the download page and we’ll convert your license to a offline license. Flick us an email at [email protected]

Question : I will pay via my paypal private account. Could you sent me invoice later?

Answer : Sure just contact us via email ([email protected]) and we’ll sort out the invoice for you.

Should the originating PDFs used for the zine be 300dpi or 72dpi?

Answer : Initially created a zine using 300dpi files but for a 68pp magazine the resulting folder size is near 200mb. Would I be better of referencing 72dpi pages?

Question : How can I reload another document via JavaScript API in HTML5 edition.

Answer :

I belive the following example will answer your question:

http://flowpaper.com/FlexPaper_QnA/?qa=1233/it-possible-to-load-pdf-file-that-is-stored-as-blob-in-database&show=1285#a1285

Question : Why am I getting javascript errors?

Answer : The first issue is most likey coming from a issue with a build we fixed recently. It should be fixed if you re-download the 2.2.9 build and if its not then contact us and we’ll direct you to a build where its not occuring.

The second issue is most likely a issue with your PDF2JSON installation and with the permissions on your server. Check so that the server side scripts are able to write to your working directory and it should go away.

Question : Setting FitWidthOnLoad parameter not working

Answer : Looks like everything is correct. Send us a email (to [email protected]) with the complete url to where you have deployed the viewer and we’ll have a closer look.

The FlexPaper Annotations software introduces multi-user online document collaborations.

Tuesday 11th November 2014

With the release of FlexPaper Annotations version 2.2.9, new neat features such as feature collaboration, extended toolbox and user name tagging has been included that will take your collaborative online annotations to a new level. Not to mention that it supports multiple formats to ensure total browser coverage.

With the new annotations features, collaboration and user name tagging of annotations, the users can interact on the same notes throughout the document enabling multiple users to collaborate in the different notes. You can easily integrate the users into your existing authentication system, so no more emails back and forth with new versions of a document.
 

FlexPaper Annotations now supports multiple formats such as HTML5, HTML4 and Flash. It really covers all the bases to ensure that everyone can view the annotated online document. FlexPaper Annotations has the ability to degrade gracefully between each format so that maximum browser penetration is achieved. The online document viewer is created to also support touch devices as well as traditional desktop browsers when you work with the annotations software.

The toolbox has been extended and multiple drawing tools such as rectangles, points and freehand drawing are added on top of the existing tool bar menu to help you make the feedback even more effective.

 
Most online annotation tools require that you upload your PDF document to their server before you can start your annotations, but with FlexPaper Annotations there is no need since it is all installed and managed by your own server letting you be in full control of your own documents.

 
Do not worry if you are not technical savvy because there is no programming skills required to get up and running with the Annotations set up scripts.
 

Existing FlexPaper Unlimited license customers already has access to FlexPaper Annotations and they can upgrade to get the new features now.

 
Want to now more? Test our demo of the latest version of FlexPaper Annotations, you can find it here:
http://devaldi.com/annotations-html5-pdf viewer/index.php?ro=flash,html&collaboration=true 

For more information on FlexPaper Annotations, visit:
http://flowpaper.com/annotations.htm 

For more information on any of FlexPaper’s viewers, visit http://flowpaper.com/

This weeks summary of questions and answers

Tuesday 28th October 2014

Question : Enable copy by default

Answer : You can activate the text selector by executing $FlexPaper(“documentViewer”).setCurrentCursor(‘TextSelectorCursor’);

Question : How to disable toolbar in Server version?

Answer : Make sure you download the customizable version and then simply edit the UI_flexpaper_desktop.html file and remove the elements you don’t want

Question : Can I embed videos that are hosted on Vimeo instead of YouTube?

Answer : We have a upcoming build which supports vimeo videos. Contact us via email for a prerelease (at [email protected])

Question : Offline documents in Commercial License

Answer : The offline publishing mode requires a license key that is specially generated for offline use. Contact us via email ([email protected]) if you would like to change your license key into a offline key.

Question : Is it possible to hide the Create Note options Point, Area and Text?

Answer : You could hide them by setting the following css style:

.flexpaper_notetypeselector{ display : none; }

Question : Can Flexpaper be used in Flash CS6?

Answer :

Yes you can actually! But it requires a bit of tricks and you will need to load the .swf file – not the .swc file. I think this url may give you some direction on how:

http://blog.pixelingene.com/2008/06/use-the-swfloader-for-loading-flash-swf-into-flex/

Question : I’m having problems installing FlexPaper on Mac OSX

Answer :

Installing with updated package file
Apple has updated its security settings for OSX version 10.9.5 so we had to resign our install files to adjust for this. The updated file is now working as it should and is available here for Zine:
http://static.devaldi.com/zine_builds/FlexPaper_Zine_Desktop.pkg

 
Installing with previous DMG file
We have also added a page with installation instructions for anyone who would like to use the older .dmg file:
http://flowpaper.com/How-to-install-FlexPaper-Desktop-Publisher-on-OSX.jsp

 

Question : Can you add a markup cloud feature

Answer : When you say clouded areas do you mean like a redaction area ? Could you illustrate or point to an existing example?

Question : Pre-load pages with HTML5

Answer : The viewer preloads the next couple of pages automatically, if you want to preload all pages into the cache then simply make a ajax call to each pdf file on the page where you’re loading the viewer. Contact us via email and we can show you how it is done

Iframe support

Answer : I am wondering if it is possible to add an iframe to the Zine so that I can have more dynamic content (slideshows, forms, etc.).

 

How difficult is it to modify the add video utility to allow other types of web content to be displayed?

Fixing your personal web server after upgrading to OSX Yosemite

Friday 17th October 2014

This is not related to FlexPaper but thought we’d share this with other developers since some of our users just upgraded to Yosemite and we think many others may have this problem.

If you have just upgraded to Yosemite and you are using the apache personal web server in OSX you may have noticed that your personal directory isn’t available any longer. To help you out we decided to post some notes on how to get this working

1. Open your /etc/apache2/httpd.conf in a text editor
uncomment the following line
#LoadModule userdir_module libexec/apache2/mod_userdir.so
and
#Include /private/etc/apache2/extra/httpd-userdir.conf

2. Open /private/etc/apache2/extra/httpd-userdir.conf in a text editor
uncomment  the following line
#Include /private/etc/apache2/users/*.conf

3. Make sure you have a /private/etc/apache2/users/(Username).conf file
also make sure that its contents looks like so:

<Directory “/Users/(Username)/Sites/”>
Options Indexes MultiViews
AllowOverride All
Require all granted
</Directory>

tada!

The “Require all granted” is important since apache has been upgraded to version 2.4 with Yosemite

FlexPaper 2.2.9 Release Notes

Wednesday 8th October 2014

We have started rolling out version 2.2.9 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)

Changes worth mentioning in this release:

  • Issue fixed related to collaborative annotations where the notes property of marks would cause a javascript error in certain configurations.

  • Our HTML4 and HTML5 rendering modes now feature full support for printing annotations
  • Improved fallback mechanisms for desktop publisher on problematic PDF documents
  • Our HTML5 and HTML4 viewers now support dragging in annotations mode with correct cursors
  • Fixed an issue where links were incorrectly positioned in html5 mode after resizing the browser
  • Fixed an issue where the author name of a note in the annotations viewer was unintentionally repeated
  • Fixed an issue where the ’ character caused an error in the annotations viewer
  • Fixed an issue where the confirmation dialog deleting an annotation appeared twice
  • Fixed an issue where documents with upper and lower case characters of file extensions were ignored in asp.net
  • Del key keycode now working to delete annotations in the annotations viewer
  • The HTML5 and HTML4 viewer now exits full screen if fullscreen button is pressed in full screen
  • Issue fixed where IE was causing a unintentional repeat of the author name in the annotations viewer
  • Improved full screen sizing for the HTML5 / HTML4 viewer to avoid cutting the toolbar off in certain sizes
  • Search panel adjusted to avoid covering the annotation tools
  • Fixed an issue wher the refreshMarks method wasn’t clearing out old annotations properly in HTML4 and HTML5 modes.
  • Fixed an issue where it wasn’t possible to set focus on the search text field in the customizable build for annotations
  • A number of minor issues corrected in our HTML5 and HTML4 annotations viewer
  • You can now add phone numbers to your publications in FlexPaper Desktop Publisher
  • New event triggered in FlexPaper Zine when a user clicks one of the social share buttons (“onSocialMediaShareClicked”) with the name of the social media as argument

This weeks summary of questions and answers

Thursday 25th September 2014

Question : How to trigger a javscript function when we click on print icon.

Answer : There isn’t any event triggered by us when the user clicks the print icon but there is a onDocumentPrinted event that gets fired when the document has completed printing.

Question : Going back to the last page viewed when the reader is opened for the second time

Answer : Yes its possible but you will need to save the information on your server (which page the user left the publication on). You can do this by attaching a event listener to the onCurrentPageChanged event and then reopening the publication by passing the last page number to the StartAtPage parameter.

You can see how to bind to this event if you open the flexpaper_handlers.js that we supply

Question : How to Set UIConfig? How to set UI like Whitepaper ?

Answer :

The easiest way of using UIConfig is by using our desktop publisher. You can set it manually in the following way:

UIConfig : ‘UI_Zine.xml’,

Question : Hello, how to open the JPG format image using FlexPaper Zine? Thank you

Answer : Yes you can load JPEG files in the following way:

http://flowpaper.com/Convert-PDF-documents-to-HTML4.jsp

Question : Hello, I am from China, I want to know how to get software after purchase?

Answer : Our software is delivered via our web site. You will get access to our commercial download area after you have completed your purchase where you can register your domain and download all builds we supply.

Question : I want all my clients to use our site to open the document

Answer : 1) Yes all clients can open your uploaded documents on your domain.

2) Yes, our Zine viewer has a sharing dialog window that your end users can be used to share the document on social networks

3) A 1-domain license can only host documents from your domain. You are fully free to let other web sites use the API on the viewer published on your domain.

Question : Server Annotation

Answer :

1- Yes it is saved on the server. We supply a sample with a database that stores the annotations to all our commercial annotation builds

2- Yes you can choose to use the collaboration mode which will show who created the annotation. Turn it on in the following way:

UserCollaboration       : true,
CurrentUser             : ‘A user’,

Question : I have added the Google Analytics code to my publication, but pageviews are not showing up in Events reporting.

Answer : It could be that you have a blocking javascript or a conflict that is preventing the tracking – contact us via email and supply us with a url to where you have deployed the viewer and we can have a look at your configuration

Question : How to integrate flex paper

Answer : We don’t have a tutorial for the Spring framework unfortunately but we do supply full source code to our java JSP example files which you can use to convert your documents

Question : Events for Social media

Answer : We have added this to our request log – follow up next week via email and we may be able to provide you with a prerelease with this included ([email protected])

How to convert pdf documents to png and jpeg using node.js

Wednesday 24th September 2014

We have had a few people ask us about how to convert PDF documents using pdf.js and node.js to JPEG or PNG, so we decided to post a quick example of how this can be done using node-webkit. 

We have made the example including source code available on GitHub under Apachev2. You can find it here:

https://github.com/flexpaper/pdfdraw

This weeks summary of questions and answers

Wednesday 10th September 2014

Question : How to print content of flex viewer using asp button in client side using javascript ?

Answer :

$FlexPaper(flx).printPaper(‘current’);  should work fine for printing the current page. As should $FlexPaper(flx).printPaper(‘1-3’); if you want to specify a range or $FlexPaper(flx).printPaper(‘all’); for all pages. 

Question : Online PDF-VIewer. Disallow PDF-Download. However dynamically allow / disallow Printing.

Answer : You can accomplish this in either of our viewers – I would recommend downloading the desktop publisher for zine. Make sure the download button isn’t enabled before exporting your publication.

Question : How do I switch between Tile and Flipview switchmode?

Answer : It will bring the user to the viewing mode that you have supplied in the “InitViewMode” parameter.

Question : Automate the process

Answer : You can automate the process by converting the documents using the command line utilities we recommend. Have a look in our documentation section under manual conversion. Feel free to ask us any questions via email if you can’t figure out how to convert parts of the document

Question : Zine viewer some documents initially show right page blank

Answer : Sounds like this could be a configuration problem – send us the url to where you have deployed your viewer and we will have a look (send it to [email protected])

Question : We want to disable copy/download of the pdf but allow printing?

Answer : Use our desktop publisher to publish your document, simply make sure the download button isn’t ticked when publishing your document.

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

Answer : Hello, the way to solve this problem is to provide the path to pdf2json which is: /usr/local/bin/

Question : The getMarkList() method returns a empty list when it only contains area or text notes, what am I doing wrong?

Answer : Sounds like a configuration error – we did have a bug related to note marks not having their note property properly populated for some scenarios in some of our previous builds but its fixed as long as you download the latest build we have in our download area.

Supply us with a url to where you have deployed the viewer and we can have a look at your configuration. Send your details to [email protected]