18 September 2013
User level: Beginning
Original publication date: 08/08/2012
Modified: 09/18/2013 (Change log)
Begin by downloading the sample files provided at the beginning of this article. The sample files contain a template that offers an alternate view of the default library. Using source code, you can change the appearance of the interface to publish a custom user experience. Figures 1-5 shows the various views of the template implementation.
Note: The Auto Archive option is only displayed if auto-archive is enabled for the viewer.
The Subscribe button is only displayed if the following conditions are true:
The Subscriber Login button is used for entitlement viewers. It is displayed if a flag,
In order to use this template you must have folios which are published as public.
Where does the data come from?
The template uses the library and store APIs to display folio data and images. All other images are packaged in your viewer. Download and uncompress the sample files folder to see the contents.
During development, it is a best practice to build and test your content on the desktop using Safari. When testing on the desktop, the API file is not available so data is loaded from the Adobe fulfillment XML feed. Using Safari allows local files to access data across domains, which is required when testing your project on the desktop.
While testing on the desktop, be sure to remove the include for AdobeLibraryAPI.js—otherwise you will be unable to view the files in your desktop browser. When testing on the desktop, if nothing is displayed open the debugger to check if there are any file paths that can't be resolved.
The following list contains descriptions of the key files in the template:
To use this template with your own DPS content, you'll complete the following steps:
The following sections describe each of these steps in more detail.
IS_ENTITLEMENT_VIEWERto false. If you are creating an entitlement viewer, you will need to set the
FORGOT_PASSWORD_URLare blank, the respective links in the signin dialog are not displayed.
FULFILLMENT_URLif you would like to test your account on the desktop. Since the API file is not available on the desktop, you can use this XML feed to display the folios. Modify
FULFILLMENT_URLto match the accountId parameter with your
accountId. To get your account id, go to http://lighthouse.adobe.com/dps/entitlement/. Once you have located your
accountId, modify the value after http://edge.adobe-dcfs.com/ddp/issueServer/issues?accountId=[your value].
If you have not made any modifications to the files you can upload the zip as is to App Builder. If you have made any changes, zip the files at the file level rather than containing folder.
Once your files are compressed, open App Builder and navigate to the Navigation Toolbar section. For more information on App Builder, watch the App Builder tutorial video. In the Navigation Toolbar section, select the option to Use Custom Viewer Library. Navigate to the zip file you created above and select the Hide Title Bar checkbox.
When your IPA has finished building, install the content on your device and begin testing.
If you would like to easily customize the colors and fonts of this template you can use the configurator.
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.