I have a web application that uses the WkWebview and has offline data stored in an IndexedDB. I am trying to load an offline PDF file from within the WkWebview using the following javascript.
var blob = b64toBlob(UserResource_data[i].PDF,'text/html'); //Stored as base 64 in indexeddb
file = new Blob([blob], {type: 'application/pdf'});
fileURL = webkitURL.createObjectURL(file);
ResourceLink = 'View PDF';
However nothing loads in the webview I just get a white screen and nothing crashes.
Swift Code:
self.webView!.loadRequest(navigationAction.request)
I have implemented a method to handle links with _blank for the target and it works fine for loading external pdf files.
Is this supported by WkWebView? or does anyone have any better ideas.
Embedding these files within the project is not an option as they must be externally update-able
EDIT - Found Workaround
Instead of using "createObjectURL()" I created a data URL
function LoadOfflinePDF(id){
var blob = b64toBlob(UserResource_data[id].PDF,'text/html');
var reader = new FileReader();
var out = new Blob([blob], {type: 'application/pdf'});
reader.onload = function(e){
//window.open(reader.result,'_blank');
console.log("LoadedpdfURL: "+id);
UserResource_data[id].PDF = reader.result;
}
reader.readAsDataURL(out);
}
Then created a popup with the dataURL
function openPDFReader(){
var id = this.id;
id = id.split("_");
id = id[1];
console.log("Opening: "+id);
window.open(UserResource_data[id].PDF);
}
So now I can properly display my offline PDF files stored in IndexedDB using the WKWebView
Related
I am using PDFJS and the viewer. I do however have the problem that annotation are not shown correctly like the are in the pdfs demo viewer https://mozilla.github.io/pdf.js/web/viewer.html.
Annotation correctly displayed in pdfs demo viewer:
Here is now it is displayed in my app using Chrome:
Here is how it is displayed I Safari using my app:
This is now I initialise the pdfs viewer:
function initPdfjs() {
// Enable hyperlinks within PDF files.
pdfLinkService = new (pdfjsViewer as any).PDFLinkService({
eventBus,
});
// Enable find controller.
pdfFindController = new (pdfjsViewer as any).PDFFindController({
eventBus,
linkService: pdfLinkService,
});
const container = document.getElementById('viewerContainer');
if (container) {
// Initialize PDFViewer
pdfViewer = new (pdfjsViewer as any).PDFViewer({
eventBus,
container,
removePageBorders: true,
linkService: pdfLinkService,
findController: pdfFindController,
});
// pdfViewer.textLayerMode = Utils.enableTextSelection() ? TextLayerMode.ENABLE : TextLayerMode.DISABLE;
pdfViewer.textLayerMode = TextLayerMode.ENABLE_ENHANCE;
// See https://github.com/mozilla/pdf.js/issues/11245
if (Utils.isIos()) {
pdfViewer.maxCanvasPixels = 4000 * 4000;
}
pdfLinkService.setViewer(pdfViewer);
return;
} else {
console.error(`getElementById('viewerContainer') failed`);
}
}
What do I need to do in order to get the annotations to display correctly in my app?
I got it working. I don't know if it is the right way, but I post it in case somebody can use it.
First I setup webpack to copy the content from ./node_modules/pdfjs-dist/web/images to my dist folder so the images got included. That solved all the display errors except {{date}}, {{time}}.
new CopyPlugin({
patterns: [
{ from: './node_modules/pdfjs-dist/web/images', to: '' },
{ from: './l10n', to: 'l10n' },
],
}),
To solve the {{date}}, {{time}} problem I set up a localisation service. I did that by copying the file ng2-pdfjs-viewer-master/pdfjs/web/locale/en-US/viewer.properties to ./l10n/local.properties in my project. Then it is copied to the dist folder by above webpack plugin. I then setup the l10n service in my pdfjs by adding this code:
// initialize localization service, so time stamp in embedded comments are shown correctly
l10n = new (pdfjsViewer as any).GenericL10n('en-US');
const dir = await l10n.getDirection();
document.getElementsByTagName('html')[0].dir = dir;
and added l10n to PDFViewer initialisation:
// Initialize PDFViewer
pdfViewer = new (pdfjsViewer as any).PDFViewer({
eventBus,
container,
removePageBorders: true,
linkService: pdfLinkService,
findController: pdfFindController,
l10n,
});
And now annotations is shown correctly:
What I find a bit weird is the date format. I used en-US as locale, so I would expect it to be mm/dd/yyyy (American way), but it is dd/mm/yyyy (like a dane would prefer it). I have tried to fool around with the date settings on my Mac and language settings in Chrome, but it doesn't look like it has any effect, so I don't know what to do if an American customer complains.
I want to use UIActivityViewController to share files from my iOS app. The main question for me is how do I handle different file types.
What I'v got so far:
Images
public void OpenInExternalApp(string filepath)
{
if (!File.Exists(filepath))
return;
UIImage uiImage = UIImage.FromFile(filepath);
// Define the content to share
var activityItems = new NSObject[] { uiImage };
UIActivity[] applicationActivities = null;
var activityController = new UIActivityViewController(activityItems, applicationActivities);
if (UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Phone)
{
// Phone
UIApplication.SharedApplication.KeyWindow.RootViewController.PresentViewController(activityController, true, null);
}
else
{
// Tablet
var popup = new UIPopoverController(activityController);
UIView view = UIApplication.SharedApplication.KeyWindow.RootViewController.View;
CGRect rect = new CGRect(view.Frame.Width/2, view.Frame.Height, 50, 50);
popup.PresentFromRect(rect, view, UIPopoverArrowDirection.Any, true);
}
}
Don't know if from the memory management aspect it is a good idea to load the image at once. What will happen if the image is too big for holding it completely in RAM? See here for example.
Strings
var activityItems = new NSObject[] { UIActivity.FromObject(new NSString(text)) };
Only text.
NSUrl
NSUrl url = NSUrl.CreateFileUrl(filepath, false, null);
Here in most cases the same app appear. But for example the PDF reader doesn't appear for a PDF file. The preview in mail on the other side shows Adobe Acrobat.
Everything
var activityItems = new NSObject[] { NSData.FromFile(filepath) };
The last approach has the disadvantage that not all apps are displayed, which for example could open a PDF file. Also this applies.
I want to use all types of files. I don't think a subclass of UIActivity would help here. Perhaps a sublcass of UIActivityItemProvider?
Side note: You can also post your solutions in Objective C/Swift.
I tried to implement UIActivityItemProvider, but here again not all apps where shown for the corresponding filetype. E.g. for a docx-document Word was not shown.
Now I switched to UIDocumentInteractionController and now there are many apps available.
UIDocumentInteractionController documentController = new UIDocumentInteractionController();
documentController.Url = new NSUrl(filepath, false);
string fileExtension = Path.GetExtension(filepath).Substring(1);
string uti = UTType.CreatePreferredIdentifier(UTType.TagClassFilenameExtension.ToString(), fileExtension, null);
documentController.Uti = uti;
UIView presentingView = UIApplication.SharedApplication.KeyWindow.RootViewController.View;
documentController.PresentOpenInMenu(CGRect.Empty, presentingView, true);
Imho there are too many apps, because the file type xml should not be really be supported by a PDF reader, but it is. Nevertheless, it seems to work now thanks to this post:
In general if you’re sharing an image or url, you might want to use a UIActivityViewController. If you’re sharing a document, you might want to use a UIDocumentInteractionController.
I have several PDF files on my computer that contain links to other pages. Those links, however, direct you to the local filesystem instead of the internet. I.e. clicking the link opens the browser and takes you to file:///page instead of http://domain/page.
Getting these files modified to include the full URL is not an option.
I tried using available Firefox extensions to redirect the URL, but none worked, so I tried creating my own extension to do the same. What I've found so far is that the URL isn't accessible until the tab's "ready" event fires, but a page referring to a local file without the full path is always "uninitialized."
Here's my extension script, almost straight from https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs:
var tabs = require("sdk/tabs");
tabs.on('open', function(tab){
tab.on('ready', function(tab){
if (tab.url.indexOf("file:///page") != -1) {
tab.url = tab.url.replace("file://", "https://domain");
}
});
});
Any ideas how to go about redirecting a page from a local file to another location?
The following snippet works fine with me.
In main.js:
var tabs = require("sdk/tabs");
tabs.on('ready', function(tab){
var new_url = tab.url;
if (tab.url.indexOf("file:///") != -1) {
new_url = new_url.replace("file:///", "https://domain/");
tab.url = new_url;
}
});
Although, my Firefox didn't fire the ready event on my tab when the url is something like what you want. For example, when the url is file:///page/lala.pdf, firefox ignores the url and does not try to reach it.
I believe Firefox wants a "real" path to load the page such as file:///C:page/lala.pdf.
I hope this will help you.
The easiest way I've found to do this is actually from another StackOverflow answer... Get Content of Location Bar. Use the function in that answer to retrieve the URL and then redirect based on that. So I end up with the following:
var tabs = require("sdk/tabs");
tabs.on('open', function(tab){
tab.on('activate', function(tab){
var { getMostRecentWindow } = require("sdk/window/utils");
var urlBar = getMostRecentWindow().document.getElementById('urlbar');
if (urlBar.value.indexOf("file:///page/") != -1) {
tab.url = urlBar.value.replace("file://", "https://domain");
}
});
});
I used webview to display a pdf which contain url links to images. However, I want to intercept the link click to display a new view instead
my webview code
webView = new UIWebView (View.Bounds);
string fileName = "EMG.pdf"; // remember case-sensitive
string localDocUrl = Path.Combine (NSBundle.MainBundle.BundlePath, fileName);
webView.LoadRequest(new NSUrlRequest(new NSUrl(localDocUrl, false)));
webView.ScalesPageToFit = true;
I looked up how to do it in obj c but I can't seem to find the equivalent method in xamarin ios
I am using Phonegap 2.6 on iOS and when a link opens it uses the fullscreen with no way of going back to the app. Is there a way to trigger some sort of controls to go back to the app? The code I have is below:
function shareonfb()
{
photoid = sessionStorage.PhotoId;
filename = sessionStorage.PhotoFilename;
postUrl = "http://site.com/sharedimage.php?photoid="+photoid;
imageUrl = "http://site.com/images/"+filename;
var sSiteUrl="http://www.facebook.com/sharer.php?s=100&u="+postUrl;
var ref = window.open(sSiteUrl, '_self', 'location=yes', 'presntationstyle=pagesheet');
}
Solved the issue by changing _self to _blank
So:
var ref = window.open(sSiteUrl, '_blank', 'location=yes');