Including external resources - JSClient Mobile App (Offline) - OS 8.0.2

Jason Gissing jasongiss1 at gmail.com
Mon Jan 30 19:09:09 EST 2017


Hi Aiden,

In order to get your extra files onto the device, the expected way to do
this is to add them to your Omnis tree (in the appropriate place under the
'html' folder), then (with Studio closed) delete the Omnis SCAF
(.../html/SC/Omnis).
Restart Studio, and it should regenerate the SCAF. Take this and add to
your wrapper project.
This is a better approach than editing the content manually, as it will
make sure to update everything (version numbers etc) necessary.

The next thing to bear in mind is that the wrapper works as follows:

When the wrapper first starts up, it will expand the contents of any
bundled Omnis SCAF into its local files area, creating a local html/...
Directory tree.

When you update SCAFS from the app, it compares the local SCAF's version
against that on the server. If the server has a newer version, it can be
downloaded and will be expanded to replace your existing local html tree
structure.

If you just replace the SCAF in the project, and rebuild and run without
increasing the SCAF version number properly, I expect it will not re-expand
the SCAF.
If you regenerate the SCAF as above, you should avoid this issue.

I would recommend completely uninstalling the app from your device, if it
still does not work. Then reinstall your updated app.

You also need to edit the jsctempl.htm file within your wrapper project, to
tell it to load your js/CSS resources.

If you still have problems, the Chrome remote debugging tools are
brilliant, if you're using Android. Safari also has some for iOS ;-)

The following tech note may be useful:
http://www.omnis.net/technotes/tnjs0006.jsp

And the following describes setting up remote debugging for Android:
https://developers.google.com/web/tools/chrome-devtools/remote-debugging


It's late - I hope some of this makes some sense!

In summary:
- regenerate SCAF automatically.
- if you're bundling SCAFs, add to project, clean and rebuild.
- edit wrapper project's jsctempl.htm
- completely uninstall, then reinstall the app if still no joy.


Many thanks,
Jason


On 30 Jan 2017 23:00, "Aidan Dunn" <aidan at freedomsoftware.co.nz> wrote:

A small follow up regarding images for remoteForms, incase this is used
sometime in the future.

After reading the recent thread "Display picture", I decided to muck around
with the picture object that I was unsuccessfully using for image
displaying.

I've figured out that the object uses data URIs to store and display the
desired image/picture.

First fill the "mediatype" property of the object to match the format of
the source image; in my case it was image/png because the source was of PNG
format; the actual name for the information is "MIME Type" and a complete
list of them can be found here "https://www.sitepoint.com/
web-foundations/mime-types-complete-list/" most of which will be usless for
this application.

Next you need to add the actual image to the "dataname" property. The image
needs to be converted into a base64 encoding. I used chrome to do this by
opening the image on page in inspector and right clicking the source to
copy as data uri; there are also online converter tools "
https://www.google.co.nz/webhp?sourceid=chrome-instant&
ion=1&espv=2&ie=UTF-8#q=online+image+convert+data+uri". This is most easily
done by using an instance variable, the tricky part is getting the
potentially long string into the variable. Easiest and most successful I
found was to copy the actual encoded string ( data:[MIME
Type];base64,[encoded string] ) into the variable's "Init.Val/Calc" field.
It doesn't show anything but it is there (you can move around the string)
(This can cause Omnis to crash on occasion). Other solution would be to
segment the string and concatenate it notationally (doesn't all fit in a
single calculation line).

This gets the image in there but it ain't pretty; you could probably use
some Javascript to adjust size or center it. I went with same solution I
had before of using CSS to add it to the background, but instead of linking
to it via URL in the css, just using the data uri. THis way I have it
styled to my liking using CSS commands.

Still have no idea how to get all this working on offline apps though...

________________________________________
From: omnisdev-en [omnisdev-en-bounces at lists.omnis-dev.com] on behalf of
Aidan Dunn [aidan at freedomsoftware.co.nz]
Sent: Wednesday, 25 January 2017 10:19 a.m.
To: omnisdev-en at lists.omnis-dev.com
Subject: Including external resources - JSClient Mobile App (Offline) - OS
    8.0.2

I've been having an issue with OS 8 since I started using it, and was
hoping someone could give some insight.

The problem is pretty simple; how does one include an external resource
such as a collection of javascript functions (a script file) to a Offline
Mobile application?

I am using a fully functional developer version of OS 8.0.2 with a active
"Web Services Server" key installed. The application works as expected on
both a browser and online mobile application.

The short of it is that I don't know how to tell the application to use
script or CSS files when in offline mode. This is with a SCAF pre-bundled
with the wrapper and without (updating the application).

Background on things I have tried...

I've simplified the application to a state that it does nothing but call a
function in the script file on $init, calling it causes a javascript error
(because the function isn't defined) and is displayed as a popup on the
device.

In order to try to get the file to execute in the application, I added the
file to the application's SCAF sqlite database, jsfiles table, by opening
it in Omnis "SQL Browser" and doing an insert command. Doing some length
checks on file_binary column, I could verify the file was in fact added.
Using a variation of path strings, finally settling on what the omnis SCAF
uses.
As I was writing this I have actually noticed that the custom files that I
had added to the scripts, css & images folders of the html folder have been
added to the omnis.db SCAF, jsfiles table, so I think it's reasonable to
assume messing around with the SCAF is not necessary.

I did a check on what files were being requested by the application by
coding javascript to output a string of all the script sources used on the
page. Online was making nearly 9 non-local requests (to my machine) where
as Offline only had 4 (omnis) script references to local files
(file:/data/user/0/appName/files/html/scripts/scriptname.js).

In order to verify the files were actually being loaded into the
application; I installed the APK on the an Android emulation (couldn't be a
device as I don't have a "rooted" one) and logged into it as a superuser
using the Android Debug Bridge (ADB) shell. I navigated the folder
structure using the path supplied by the Offline app's script href/src
strings, and verified that the html folder structure did in fact contain my
files.

As a last ditch attempt I created some javascript to manually add the
reference to where the custom javascript file should be kept, using the
existing references as a reference (hah). That included creating a script
element, adding the "src" attributes to the element and appending that to
the page's head element. Then calling a function from the file (like
initially doing), but it only gave the same error.


P.S: Insight into using images would be appreciated aswell; the current
online solution i'm using is to write CSS to add it to the background of a
image object.


Any help with this problem would be greatly appreciated. Perhaps examples
on how you were able to do this?


Aidan Dunn

_____________________________________________________________
Manage your list subscriptions at http://lists.omnis-dev.com

_____________________________________________________________
Manage your list subscriptions at http://lists.omnis-dev.com



More information about the omnisdev-en mailing list