Android Question More on creating Help Files

[Gavin]

Hi to everyone
I have created a help file using a program called HelpScribble.
These files were then added to the project using File Manager, Add Files.
I then view the webpage using the following

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("help")
   
    helpfile.LoadURL("file:///android_asset/blanksudokuweb.html")

End Sub

All seems fine. The Webpage appears and the navigation seems to work except, "where are the .png images?"
With HelpScribble, you can "Export to Web Help" which, to quote, "export your help project to a series of HTML files that you can upload to your web site to provide online documentation."
When you view the files on your PC, they are all neatly placed in the one folder.
I would have thought that simply adding these files to you B4A project and using WebView was all that is required but, maybe not.
At this stage, I am at a loss. You do see where the images should be using WebView but not the actual image.
Suggestions welcome. Full code and images available if required.

Thank you.
Gavin

 

[bluejay]

You need to tell the webview where the files are located by using loadDataWithBaseURL.

The example below has the help files in a subfolder located at 'file:///android_asset/myhelpfilesdirectory/'.
You can set HtmlDir to "" if there is no subfolder.

I am using a TextReader here to deal with html file character encoding.

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.

End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.
    Dim WebV      As WebView
    Dim Panel1    As Panel
   
    Dim HtmlDir   As String
    Dim HtmlFile  As string   

End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("Layout1")
    WebV.Initialize("")
    Panel1.AddView(WebV, 0, 0, 100%x, 100%y)
    HtmlDir  = "myhelpfilesdirectory/"
    HtmlFile = "introduction.html"

End Sub

Sub Activity_Resume
   Dim Html As String
   Dim tr   As TextReader
   
   tr.Initialize2(File.OpenInput(File.DirAssets,HtmlDir&HtmlFile),"ISO-8859-1")
   Html = tr.ReadAll
  
   LoadDataWithBaseUrl(WebV, File.DirAssets&HtmlDir, Html)
End Sub

Sub LoadDataWithBaseUrl(wv As WebView, sBaseUrl As String, sHtml As String)
  Dim r As Reflector
  r.Target = wv
  r.RunMethod4("loadDataWithBaseURL", Array As Object (sBaseUrl, sHtml, Null, "UTF-8", Null), Array As String("java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String"))
End Sub

Bluejay

 

[Gavin]

Thank you Bluejay
I tried you code but could not get a result. Not because your code does not work, it is because I still do not understand the android file system.
I finally figured out that the correct location location of my help files is, "file:///storage/sdcard0/HtmlHelpFiles/hhp/blanksudokuweb.html"
When I use this code

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("help")

    helpfile.LoadURL("file:///storage/sdcard0/HtmlHelpFiles/hhp/blanksudokuweb.html")

End Sub

my help file runs as expected.

So, now knowing where the files are, I tried your code,making the following changes

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Private helpfile As WebView
  
    Dim        HtmlDir        As    String
    Dim        HtmlFiles    As    String
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("help")
    HtmlDir        = "HtmlHelpFiles/hhp/"
    HtmlFiles     = "BlankSudokuWeb.html"
  
  End Sub

Sub Activity_Resume
    Dim Html As String
    Dim tr   As TextReader
                     
    tr.Initialize2(File.OpenInput(File.DirRootExternal,HtmlDir&HtmlFiles),"ISO-8859-1")
    Html = tr.ReadAll

    LoadDataWithBaseUrl(helpfile, File.DirRootExternal&HtmlDir&HtmlFiles, Html)
End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub LoadDataWithBaseUrl(wv As WebView, sBaseUrl As String, sHtml As String)
  Dim r As Reflector
  r.Target = wv
  r.RunMethod4("loadDataWithBaseURL", Array As Object (sBaseUrl, sHtml, Null, "UTF-8", Null), Array As String("java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String"))
End Sub

sBaseUrl contains
file:///storage/emulated/0HtmlHelpFile/hhp/BlankSudoku.html

When I use a file manager and open my html, the "path" is,
file:///storage/emulated/0/HtmlHelpFile/hhp/BlankSudoku.html, "/" after the 0 and the page shows as one would expect.

I changed HtmlDir to = "/HtmlHelpFiles/hhp/"
Now sBaseUrl contains
file:///storage/emulated/0/HtmlHelpFile/hhp/BlankSudoku.html, exactly the same as when I open the Html from the file manager.
I would have expected the html to display correctly however, all I get is a web page with the contents divider, but no text or images.
So, I must be doing something right and alot wrong.

Gavin

 

[bluejay]

Your BaseURL should point to a directory not a html file.

LoadDataWithBaseUrl(helpfile, File.DirRootExternal&HtmlDir, Html)

Note File.DirAssets points to inside the compressed APK which is where the files would be if included in the application.

 

[Gavin]

Thank you BlueJay
I saw and understood the error you pointed out, so I corrected it. Still no luck.
I will shortly compile a small Application, upload it with the help files and instructions for you (and others) to see what is happening.
Thank you for your patience.

Gavin

 

[Gavin]

I have uploaded two files.
The BlankSudokuHelp files should be copied to the Download Director on you mobile device.
In the Sub LoadDataWithBaseUrl, Rem and unrem the different code to see what is happening.

Gavin

 

[gz7tnn]

Hi Gavin

It may be as simple as updating the html files and make all the references to image files to be lowercase. I have attached my quick version of your help file and on the 'protecting entries' page I have lowercased 2 of the file names and left the rest UpperCase.
2 show and the rest don't.

The actual file name can be Uppercased - just the html code needs changing.

I am using an older version of B4A so was not able to test yours properly.
Basically I am just using a webview to display the pages, and have placed all the html and png files into the 'files' folder inside the app so that they are included in the apk file . I see you are loading your ones from another location.
I suspect the solution to your problem may be as simple as updating the png file names in the html code.
Hope that helps - and works for you

 

[bluejay]

This is a good point. I have found it is in generally easier to make all filenames lowercase as it reduces issues if you are using Windows tools for generating source files. Even though I normally prefer Camel Case. Unfortunately Windows sometimes changes case in filenames (like capital for first letter) which is annoying but easier to spot if you know everything is supposed to be lowercase.

 

[Gavin]

Thank you gz7tnn and bluejay.
The original problem I was having is that when, from HelpScribble, you export to HTML Help, HelpScribble creates two folders (directories), one "html" and the other "images".
In the html code, images are referred to as, for example COLOR="#800000" SIZE="3"><IMG SRC="../images/sudoku_3.png". So, you can not load your images into
"file:///android_asset", they must be loaded into "file:///android_asset/images" so the html code can find them.
The code I uploaded in post 6 is working fine on all three devices I own.
It is my opinion that files such such as Help Files should not be stored in the "android_asset" directory as these are files which may need updating on occasion.
My aim, with this application, is to develop a method of being able to easily update such files by simply downloading to the "Download Directory" on your device then, simply run the application. It is simply a learning curve and practice for me.

As for bluejay's reply #2, I still can not get
r.RunMethod4("loadDataWithBaseURL", ArrayAs Object (sBaseUrl, sHtml, Null, "UTF-8", Null), ArrayAsString("java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String"))
to work. I have been dong some research and found this posting

https://www.b4x.com/android/forum/threads/webview-questions.21087/

So, to me it appears using
yourwebview.LoadURL()
is the same as using

r.RunMethod4("loadDataWithBaseURL", ArrayAs Object (sBaseUrl, sHtml, Null, "UTF-8", Null), ArrayAsString("java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String"))

Is this the case and if so, where would it be more advantageous to use "loadDataWithBaseURL". A full working example required.

Viewing sHtml in the debug watch window, I see it contains the HTML Code of "BlankSudokuWeb.html" which, makes sense as

tr.Initialize2(File.OpenInput(File.DirAssets,HtmlDir&HtmlFile),"ISO-8859-1")
Html = tr.ReadAll

reads the file into Html, similar to "Open MyFile For Input As #1", "Line Input #1, MyString", or at least that is what it appears to me.
Some more research on "loadDataWithBaseURL" required on my behalf.

Gavin

 

[gz7tnn]

Hi Gavin
You say in that last post:
"It is my opinion that files such such as Help Files should not be stored in the "android_asset" directory as these are files which may need updating on occasion.
My aim, with this application, is to develop a method of being able to easily update such files by simply downloading to the "Download Directory" on your device then, simply run the application. It is simply a learning curve and practice for me."

This article here says that when you update your apk on Google Play that all users will - depending on their device settings - receive notification about an updated version. So by including your new html and png files inside an updated apk should achieve what you want.

My thought also is, unless you had a skilled user base in mind for your app, that perhaps few users would have the skills to download help files to a directory on their device to perform the update. And how would they become aware of the updates?

Feel free to correct me if I have misunderstood what you are wanting to achieve

 

[Gavin]

More than ten years ago I had, well, lets say, a rather heated telephone debate with a software representative concerning their product. They rang me to inquire as to what I thought about their product. The rep then asked if I used a certain feature of their product.
"Not at this stage," I replied, "but maybe later on I will."
"Oh, so you will have to purchase the latest and greatest", the rep replied. (Well, maybe not those exact words.)
"Why, when a simple .ini file or external DLL could achieve the same outcome."

I have never forgotten that exchange. So, while writing this application and using third party software to write the html help files, I decided this would be a good opportunity to learn how to access files not in the "android_asset/" directory. I agree that in a simple, free application like this, most, if not all programmers would include these files in
android_asset/.

Anyway, back to my real problem.

r.RunMethod4("loadDataWithBaseURL", ArrayAs Object (sBaseUrl, sHtml, Null, "UTF-8", Null), ArrayAsString("java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String", "java.lang.String"))

I still can not get this method to display text and image.

Also, I tried this, ( a slight variation to bluejay's #2 post)

HtmlFile = "idx.htm" (in main activity)

Dim Html As String
Dim tr As TextReader
tr.Initialize2(File.OpenInput(File.DirRootExternal,Main.HtmlDir&Main.HtmlFile),"ISO-8859-1")
Html = tr.ReadAll
helpfile.LoadHtml(Html)

This procedure does display the individual page "idx.htm" but, when you click the link, you receive "The web page at file:///hs10.htm could not be loaded because:
net:ERR_FILE_NOT_FOUND.

When I use,
helpfile.LoadURL("file:///"&File.DirRootExternal&Main.HtmlDir&Main.HtmlFile)
the web loads and runs normally.

I know they are different procedures but, what I do not understand (yet) is "when" to use RunMethod4 or LoadHTML. I do now understand LoadURL.

Gavin