Displaying / Accessing Files (e.g PDF) in AR Application

Hi @drieder,

According your quesiton I want to share some info (it was a quesiton to PTC developement team)

Question:

"PDF file is not fixed and hence cannot be converted to some other format for viewing. Tried using iframes to display the pdf file but it shows only first page on iPhone. Not tried with Android devices as yet.

I have placed the iframe inside a div which makes it scrollable. It works fine in preview but shows only first page on iPhone

Sample javascript code to launch the popover with iframe is as below -

function createPdfTemplate(title, fattach_loc) {
 return '<ion-popover-view class="popover-supportingdocs-class"> \
 <ion-header-bar> \
 <h1 class="title">' + title + '</h1> \
 <button ng-click="popoverDocsPdf0.hide();" class="button button-icon icon ion-close-circled popover-supportingdocs-close-class"></button> \
 </ion-header-bar> \
 <ion-content class="popover-supportingdocs-content-class" scroll="false"> \
 <div class="responsive-wrapper-class"> \
 <iframe src="' + fattach_loc + '"></iframe> \
 </div> \
 </ion-content> \
 </ion-popover-view>';
 };

 var docsPdfTemplate0 = createPdfTemplate('test2.pdf', 'app/resources/Uploaded/test2.pdf');
 $scope.popoverDocsPdf0 = $ionicPopover.fromTemplate(docsPdfTemplate0, {
 scope: $scope
 });
 $scope.popoverDocsPdf0.show();


CSS -
.responsive-wrapper-class {
 position: relative;
 -webkit-overflow-scrolling: touch;
 overflow: auto;
 height:100%;
}

.responsive-wrapper-class img,
.responsive-wrapper-class object,
.responsive-wrapper-class iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 border-style: none;
 padding: 0;
 margin: 0;
}

.popover-supportingdocs-close-class {
 color: #70AC32 !important;
 padding: 0px !important;
}

.popover-supportingdocs-class {
 position: fixed;
 height: 100%;
 width: 100%;
 opacity: 1;
 top: 0;
 left: 0;
 margin-top: 0;
 margin-left: 0;
}

.popover-supportingdocs-content-class {
 .scroll {
 height: 100%;
 }
}

END of question part"

>>  So according this quesion we see that the display of PDF is possible in popover but there seems currently to be an issue so that only the first page could be displayed - so means you can use this solution for documents having only one page or you can use it  on other platforms (not on IOS - so belive the issue does not exist on Android) 

So here the suggestion of the PTC developement:

==========================

Looks like iOS has a limitation showing PDF in a iframe or embed tag to showing the first page as an Image.

A solution could be to download the PDF file and let the native app for PDF show it.  There appears a link in the top-left to go back to the View experience when done looking at the file.

There is a new widget coming to allow downloading resources such as pdf to view.  

What you could do is try setting the window.location.href to be the url to the pdf to test it out.  Try this code:

/

/ Creating an anchor element to fully qualify the URL 

  var anchor = document.createElement('a');
  anchor.href = 'app/resources/Uploaded/< filename >';
  window.location.href = anchor.href;