How to display pdf in a WebView in terms of UI and UX - iOS Swift - ios

Brief about the app: The app parses html documents and load it in the app as a web view.
In the iOS app I like to show PDF files. There is a structure XML that would contain the whole structure.
Case 1: For a simple PDF file it would look like the following in the structure.xml
<node id="Nc13d37aa" node_id="82cd790d-e5f0-4ee6-a26c-a6e400af8541" type="publication" default="TEST_Pub" secured="false">
<language name="en-GB" path="X-BIKE-401/en-GB/publications/TEST_Pub-003.00.pdf">
<title>(Test-)Publication</title>
</language>
</node>
Case 2: In a more complex scenario one publication might contain a so called ATI's(Additional technical information) This would look like this:
<node id="Nd747c4dc" node_id="b4528fb8-c615-4b96-945d-a5af009325f2" type="publication" default="TEST_Pub_ATI" secured="false">
<language name="en-GB" path="X-BIKE-401/en-GB/publications/TEST_Pub_ATI-003.00.pdf">
<title>(Test-)Publication with ATI</title>
<atis>
<ati id="ati584a41ee" internal_id="af720ef4-5238-4fb4-ba8b-a5ae00debfae" code="Test_ATI" type="Service Letter" required="false" issuecode="Test_ATI_03" issuenumber="3" revisionnumber="0" href="X-BIKE-401\en-GB\ati\Test_ATI-003.00.pdf">(Test-)ATI</ati>
</atis>
</language>
</node>
The idea here is, that we have additional legacy documents accompanying a legacy publication. The idea here would be, that we show the normal legacy publication, but have an additional area in the view, that indicates the user, that there ARE ATIs, and a way for him to view the ATIs - but also get back to the original publication. An ATI is usually some information
Case 3: There is also the case, that one or many ATIs are mandatory.
This means, that the user needs to read & confirm those first, before he can read the actual publication. This will be like:
<node id="N5a3c00f" node_id="09fe8d7b-a95d-4da8-bf06-a5af00933ddc" type="publication" default="TEST_Pub_mATI" secured="false">
<language name="en-GB" path="X-BIKE-401/en-GB/publications/TEST_Pub_mATI-003.00.pdf">
<title>(Test-)Publication with MANDATORY ATI</title>
<atis>
<ati id="ati35c8ee0e" internal_id="60dfaa70-f017-44ea-9190-a5ae00df2494" code="Test_ATI_MAND1" type="Service Bulletin" required="true" issuecode="Test_mATI_03" issuenumber="3" revisionnumber="0" href="X-BIKE-401\en-GB\ati\Test_ATI_MAND1-003.00.pdf">(Test-)ATI1 (MANDATORY)</ati>
<ati id="atic771b1b6" internal_id="d1cffa4b-b1be-4bbb-8dc0-a743010cf246" code="Test_ATI_MAND2" type="Service Bulletin" required="true" issuecode="Test_mATI2_01" issuenumber="1" revisionnumber="0" href="X-BIKE-401\en-GB\ati\Test_ATI_MAND2-001.00.pdf">(Test-)ATI2 (MANDATORY)</ati>
</atis>
</language>
</node>
You can see, that two have the #required set to "true".
In this case we need to first show the first ATI, request the user to "confirm" somewhere that he read it. move on to the next required ATI and conform this as well. and once he has confirmed all the ATIs, he can view the publication itself.
Still he needs to be able to reopen the ATIs (similar to the previous point) and look them up again - without confirmation again.
The user needs to reconfirm, once the publication is closed.
Question: For case 2 & 3, how would this might look like? a mockup of it how would it be? Ideally a proposed solution best in terms of UI and UX.

I can suggest you this way , it may solve your question :
CASE 1 :
Simply Take a UIWebView and show PDF url link , then WebView will render it perfectly .
CASE 2 :
In case 2 you are first showing the case 1 where you show simple PDF and showing it by rendering the web view but then this PDF has extra information called ATI that we need to show this somehow on the web view. So for example a button that when you click on it it will show the extra information maybe in a pop up and then there should be a navigation back to the original PDF
CASE 3:
Use some Image Flipper library to show multiple pdf doc in which you can show some sort of info to acknowledge the user about there are more than one doc is there for navigation .
For Flipper follow this library : https://cocoapods.org/pods/DJKFlipper
Thanks.

Related

How to get pseudo elements in WebdriverIO+Appium

I want to get a value (content) from the CSS of a pseudo element (::before) while inside a test made using WDIO and Appium for an Android hybrid app because the designer has stored the current responsive-design state there. So my tests would know which layout (elements) to expect.
Multiple answers to related questions (1; 2; 3) indicated that using .getComputedStyle() might be the only solution. But this does not seem to work in my tests. The error is window is not defined for window.getComputedStyle(...) or document is not defined if I use document.defaultView.getComputedStyle(...). Also selectors themselves can't address pseudo-elements it seems.
Example of one of my many attempts:
document.defaultView.getComputedStyle($('body'),'::before').getPropertyValue('content')
Question: Do I need to somehow import window or document to my test? Is there some other way to get window or document from inside the test?
Ultimately: how can I get the content value of ::before of the <body> of a hybrid Android app?
Thanks to Jeremy Schneider (#YmerejRedienhcs) & Erwin Heitzman (#erwinheitzman) for help!
One solution is to use the execute function:
let contentMode = browser.execute(() => {
let style = document.defaultView.getComputedStyle(document.querySelector('body'),'::before');
return style.getPropertyValue('content')
});
Alternatively maybe something could also be done with getHTML.

Issue with FDF on different platforms PDFTron

I am facing an issue wherein I am unable to show annotations on my PDF on IOS device that are made from some other platforms e.g web, Windows or android. What is actually happening is if I am editing an already created annotation like an underline by changing the notes associated with it from my iOS device, then it is not reflecting on other platforms.
On further Investigation, I found that the PDF format generated by PDFTRON on iOS is different from the format generated by PDFTRON on any other platform. For example, I draw an underline annotation on a document from the web. The initial FDF received is as follows:
<squiggly subject="Squiggly" page="0" rect="275.93,656.703203,336.2084,665.759453" flags="print" name="0eabf5b2-77ab-4c04-3379-438e7a8fc714" title="testuser" date="D:20161027122930+05'30'" color="#FF0000" opacity="1" creationdate="D:20161027121425+05'30'" coords="275.93,665.76,336.21,665.76,275.93,656.7,336.21,656.7"><contents-richtext><body xmlns="http://www.w3.org/1999/xhtml" xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/" xfa:spec="2.0.2" xfa:APIVersion="Acrobat:10.1.3"><p dir="ltr"><span dir="ltr" style="font-size:10.0pt;text-align:left;color:#000000;font-weight:normal;font-style:normal">under_line</span></p></body></contents-richtext><contents>under_line</contents><popup flags="print,nozoom,norotate" page="0" rect="0,692,150,792" open="no"/></squiggly>
I have entered the text under_line in the notes initially. Now when I edit this annotation from the web (Changing the text from under_line to under_lines) , the resulting FDF is as follows:
<squiggly subject="Squiggly" page="0" rect="275.93,656.703203,336.2084,665.759453" flags="print" name="0eabf5b2-77ab-4c04-3379-438e7a8fc714" title="testuser" date="D:20161027122930+05'30'" color="#FF0000" opacity="1" creationdate="D:20161027121425+05'30'" coords="275.93,665.76,336.21,665.76,275.93,656.7,336.21,656.7"><contents-richtext><body xmlns="http://www.w3.org/1999/xhtml" xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/" xfa:spec="2.0.2" xfa:APIVersion="Acrobat:10.1.3"><p dir="ltr"><span dir="ltr" style="font-size:10.0pt;text-align:left;color:#000000;font-weight:normal;font-style:normal">under_lines</span></p></body></contents-richtext><contents>under_lines</contents><popup flags="print,nozoom,norotate" page="0" rect="0,692,150,792" open="no"/></squiggly>
The same annotation when edited from an iOS device produces the following FDF:
<squiggly subject="Squiggly" page="0" rect="275.93,656.703203,336.2084,665.759453" flags="print" name="0eabf5b2-77ab-4c04-3379-438e7a8fc714" title="testuser" date="D:20161027122930+05'30'" color="#FF0000" opacity="1" creationdate="D:20161027121425+05'30'" coords="275.93,665.76,336.21,665.76,275.93,656.7,336.21,656.7"><contents-richtext><body xmlns="http://www.w3.org/1999/xhtml" xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/" xfa:spec="2.0.2" xfa:APIVersion="Acrobat:10.1.3"><p dir="ltr"><span dir="ltr" style="font-size:10.0pt;text-align:left;color:#000000;font-weight:normal;font-style:normal">under_line</span></p></body></contents-richtext><contents>under_lines</contents><popup flags="print,nozoom,norotate" page="0" rect="0,692,150,792" open="no"/></squiggly>
Now you can see the difference. When I edit the text on the web, the text is changed at both points wherever it appears while when it is changed from the iOS device , the text is updated at only one place.
I believe this is causing a problem for me. How can I resolve this?
Annotation can actually have two Contents. The regular one, and a Rich Contents (essentially a minimal subset of HTML). The two are not guaranteed to be the same, which is the case here. One field got updated, the other didn't, as this actually depends on the specific PDF software used.
There is no difference between our different SDK's in this regards, so either you used two different files, or two different PDF readers. It sounds like on iOS used a 3rd party program.

Adding a datamodule to the delphi object repository

I am using D10 Pro. I added a datamodule to the object repository by right clicking it and selecting "Add to Repository" on the popup menu.
The datamodule shows up in the New>Other dialog and I am able to click the icon for it. When I do, I get the following exception: "Unable to find both a form () and source file (). The same exception occurs with forms I place there. The object that came with Delphi load without any problem. How do I fix this?
When adding items to the repository, you should avoid using dotnet style names for your files. For example, I originally named the file "MyLib.Datamodule.TextImporter.pas" and I received the error in my question. I experienced the same problem with a form using the same dotnet style naming. After changing the file name to "TextImporterDatamodule.pas" and adding it to the repository, I was able to use it to create new datamodules without a problem. This is something Embarcadero needs to address.
I can't answer your q, but maybe this will help you track down your problem.
Contrary to what the DocWiki says for Seattle, the repository .Xml file is actually named "Repository.Xml" and in my case is located here:
C:\Users\MA\AppData\Roaming\Embarcadero\BDS\17.0\Repository.Xml
I added a data module to it, resulting in the entry shown below being added.
Notice that for a datamodule, the path to it is stored in its IDString
attribute along with the filename, unlike a form, where the path+name is stored
in the the Value attribute of the FormName node.
With that entry in place, unlike you I can then include a copy of it in a project
by going to File | New | Other in the IDE. However, if I then change the
on-disk name of the folder where the item is located, and try to use it, I get the error
message you quoted. Of course, that doesn't mean that's why you're getting
it, but I thought it might help to see the repository entry for something that's known to work.
<Item IDString="D:\Delphi\Code\SO\Devex\DM1" CreatorIDString="BorlandDelphiRepositoryCreator">
<Name Value="AAADataModule"/>
<Icon Value=""/>
<Description Value="MA datamodule"/>
<Author Value="MA"/>
<Personality Value="Delphi.Personality"/>
<Platforms Value=""/>
<Frameworks Value=""/>
<Identities Value="RADSTUDIO"/>
<Categories>
<Category Value="InternalRepositoryCategory.MyCategory" Parent="Borland.Delphi.NewFiles">MyCategory</Category>
<Category Value="Borland.Delphi.NewFiles" Parent="Borland.Delphi.New">Delphi Files</Category>
<Category Value="Borland.Delphi.New" Parent="Borland.Root">Delphi Projects</Category>
</Categories>
<Type Value="FormTemplate"/>
<Ancestor Value=""/>
<FormName Value=""/>
<Designer Value="Any"/>
</Item>
If this doesn't help, best I can suggest is to post your q in the IDE section
of EMBA's newsgroups here:
https://forums.embarcadero.com/forum.jspa?forumID=62
I don't think that should provoke cross-posting complaints, seeing as your q has been up here for a while without getting a definitive answer.

How Automatically On "Content Blocker" Extension in Safari section?

I am creating an Ad Blocker. I am just trying to Automatically on safari extension of "Content Blocker". I went through examples but did't found any solution. Is there any way to "ON" extension or manually we have to start it?
On iOS, Safari Content Blockers are disabled by default.
There is no way to automatically enable them from your app. You must instruct the user to:
Open the Settings app.
Go to Safari > Content Blockers.
Toggle on your Content Blocker extension.
On macOS (as of 10.12), a similar rule applies: Content Blocker extensions (bundled with your app) are disabled by default, and must be toggled on by the user in Safari Preferences > Extensions.
Assuming you want to test your "personal AdBlock program", first prepare a dummy HTML, with this line <div class="ads">hello</div>,
next apply your "personal AdBlock program", assuming it is JavaScript/CSS based and not proxy-like, you either hide, or remove the element (Node) from the DOM.
for example:
document.querySelector('div[class*="ads"]') -- this is nice and (very) generic way to find the element.
this is how to hide "the ads"
document.querySelector('div[class*="ads"]').style.display="none";
or, to make it stronger, related to other rules on the page, make it a local style + important notifier: document.querySelector('div[class*="ads"]').style.cssText="display:none !important;" ;
you can also remove the element (Node) from the DOM:
var e = document.querySelector('div[class*="ads"]') follow by:
e.parentNode.removeChild(e);
now, you probably want to see that "YOUR ADBLOCK" worked,
later (after the page has loaded, and your javascript code runned) type:
console.log(null === document.querySelector('div[class*="ads"]') ? "removed(success)" : "still here(failed)")
note that for this example (to make things simple) I assume there is only one div with that class in the page (avoiding loops :) ).
if you've just going to hide the element, you should query its current (most updated) style-condition, using a native method exist under window:
console.log("none" === window.getComputedStyle(document.querySelector('div[class*="ads"]')) ? "hidden(success)" : "still here(failed)")
Enjoy!

Use WatiN for automation upload file on the website

I need upload file on the website.
But Have a problem, i can't choose file automatic in code. Always browser show me choose file window.
What wrong in my code?
IE ie = new IE("https://www.xxxx.com/WFrmlogin.aspx");
FileUploadDialogHandler uploadHandler = new FileUploadDialogHandler(#"D:\065-6405_URGENT.xls");
ie.WaitForComplete();
ie.TextField(Find.ById("txtUser")).TypeText("login");
ie.TextField(Find.ById("txtPassWord")).TypeText("***");
ie.Button(Find.ById("btnok")).Click();
ie.WaitForComplete();
ie.GoTo("https://www.orientspareparts.com/inq/WFrmUpOption.aspx");
ie.WaitForComplete();
ie.DialogWatcher.Clear();
ie.AddDialogHandler(uploadHandler);
// This code show choose file dialog
ie.FileUpload(Find.ById("FilUpload")).ClickNoWait();
ie.Button(Find.ById("butUpload")).Click();
ie.WaitForComplete();
I had the same problem. I'm using a GMail-like upload process, so I wanted to test actual use-cases. Just setting the Text property on my hidden file input wasn't an option.
I ended up using SendKeys to type the path to my file, then sent "{ENTER}" to submit the dialog.
SetForegroundWindow(browser.hWnd);
SendKeys.SendWait("{ENTER}");
Thread.Sleep(500); // An unfortunate necessity, to give the dialog time to pop up.
SendKeys.SendWait(#"C:\myfile.jpg{ENTER}")
I don't love this solution, especially not the sleep, but it was the best I could do in under 30 mins.
If anyone has a better option, let me know!
Why do you need to select from the Dialog? Try to just set the Text:
ie.FileUpload(Find.ById("profile_file")).Text = "C:/Desktop/image.jpg";
I guess you might talk to the fellow who asked this question:
WatiN File Upload

Resources