Javascript problem

[eero]

Hi

I made this tutorial: https://puravidaapps.com/math.php

Everything was right, I downloaded .aia file and tested in both way, Ai companion to connect to phone, and yes it worked. Then I changed global development to false and made the build, everything was fine.

Butbut, i made this again from scratch, made my own blocks (exactly same as original, copying the html code from tutorial page). With Ai companion way this works also but not when I made build.

What can be wrong? Page is not available it says, those times of course comes to display but it shows wrong information.

-e-

[Taifun]

probably this

Yes, you also can upload html files as assets into App Inventor! There is only one special thing to consider: During development, you have to use the development path to the embedded html document:

file:///mnt/sdcard/AppInventor/assets/<NAME OF YOUR HTML FILE>.html

Before packaging the app, use the production path.

file:///android_asset/<NAME OF YOUR HTML FILE>.html

Taifun

---

Trying to push the limits of App Inventor! Snippets, Tutorials and Extensions from Pura Vida Apps by Taifun.        

[eero]

Understood

I followed the tutorial and I understood there is a variable which is handling this issue and as I described with the downloaded .aia files this works fine, changing the flag is handling this path issue.

Could You tell where else those path must be fullfilled?

Have You tried made this again from zero? With a different naming of those .html files?

-e-

[Taifun]

It would really help if you provided a screenshot of your relevant blocks, so we can see what you are trying to do, and where the problem may be.

[eero]

Hello

Here is my blocks&screenshot from my device&html file:

Verkkosivu ei saatavilla = web page not available (translation from finnish to english, sorry, my device is with finnish language)

Unfortunately those pictures are before text, I don understand how to modify the page lay-out to be clever outlook...

Hope it helps...

-e-

[Taifun]

in the designer, set clock enabled to false

Taifun

[eero]

Doublecheked, it was false and it is false, same error still.

[Taifun]

this seems to be a small timing issue

try to set the timer interval  a litte bit higher

Taifun

[eero]

Maybe some timing issue.

I believe there is some bigger problem.

I made a tiny app where I have animated gif (showing it on webviewer). Everything is OK until I make this production to my device, It not working anymore.

Is it only me who has this kind of problem with webviewer?

I am running with ubuntu 14.04 +firefox 49.0+Asus tablet&Sony phone.

This html usage with Ai2 would be nice and expands the possibilities but because it is broken I cannot use it...

-e-

Tiny update: same behaviour with Win10+firefox+huawei, not working!

[Ghica]

You know that animated gif's do not work in App Inventor?
In the companion it may seem to work, but when you create an .apk. it does not work anymore.
Cheers, Ghica.

[eero]

Thanks for the information, I didn't know this issue, I thought this kind of tutorial is valid: https://puravidaapps.com/snippets.php#2ani

So, if this fact as Ghica told is true, it could be good if this tutorial has this kind of info of lack of functionality? https://puravidaapps.com/snippets.php#2ani

But still, there seems to be some problem with webviewer component, because this javascript problem is still valid to me.

-e-

Some tiny editing to this case:

-Yes Ghica is right, the default behaviour is like I has noticed, no gif, no Javascript, no nothing html can be displayed.
-Yes, Pura's tutorial is OK if You download .aia file from there, everything is working nice


BUT: there is a bug with AI2: it is not capable to transfer (I don't know the right term to this) the asset information to product.

How I did solve this?

1. Make .aia file of Your project
2. Extract this .aia package (t seems to be normally zip package... with special extension)
3. Make a folder assets
4. copy Your .html file over there
5. compress those file back and rename .zip to .aia
6. Import this .aia file back ( keep on mind there is not project with same name!!!)
7. Make a product and enjoy !


Now I have speedometer with rolling Toyota logo :)

Thanks again to challenge my skills :) the best way to learn is try try try try.....

[Taifun]

as already said, just use a larger timer interval to fix the timer issue (see example attached, which uses 1000ms as default)
just build the example app and test it on your device (and don't forget to set the flag development accordingly)

and after doing the example only once, you even can set the timer interval to 1 millisecond to get it working
the html page must be available for the example to work correctly and the page is available after running once

concerning the gif example: App Inventor components like the image component or canvas can't display animated gifs as Ghica said
however the webviewer can do it as shown in the snippet App Inventor and animated gifs

There is one special thing to consider for HTML documents uploaded as assets into App Inventor: During development, you have to use the development path to the embedded HTML document.

file:///mnt/sdcard/AppInventor/assets/ani.gif

Before building the app, use the production path.

file:///android_asset/ani.gif

Taifun

EDIT: aia file removed, see improved version below

[Taifun]

I now improved the example and set the HomeURL of the webviewer in the Screen1.Initalize event
later I just use Webviewer.GoHome to start the JavaScript calculations
now you can use a very short timer interval (1 millisecond) to get it working

Taifun

---

Trying to push the limits of App Inventor! Snippets, Tutorials and Extensions from Pura Vida Apps by Taifun.

[eero]

NO, the time is not the issue, it is AI2 problem with assets.

I checked Your -aia file and You are not making this exercise from scratch, if You do, You notice same problem which I already solved by myself, but happy christmas anyway.

-e-

[Taifun]

it is AI2 problem with assets.

it looks like you are not familiar with how to upload assets into your project?

in the Media section of the designer click the Upload File button, select your file and upload it into your project

Taifun

[eero]

Thanks man, I have to test it if it the solution behind of this case.
I did not realize the .html page is a media....

Quite funny is the case there is no good explanation of what needs to be uploaded which not, maybe some future update to some guidance is needed in this case.

This case can be closed due the thanks&help of Taifun... (again).

My proposal is to do some tiny reminder which files must be upload and when, which are media files which must be uploaded?, normal user can not know which one have to be, for example program icon file goes quite nice as like other pictures and they are in same media section.

-e-

[Taifun]

 there is no good explanation of what needs to be uploaded which not, 

is there something which does not need to be uploaded?

it helps to do the tutorials to learn the basics...

A very good way to learn App Inventor is to read the free Inventor's Manual here in the AI2 free online eBook   http://www.appinventor.org/book2 ... the links are at the bottom of the Web page.  The book 'teaches' users how to program with AI2 blocks.

There is a free programming course here http://www.appinventor.org/content/CourseInABox/Intro  and the aia files for the projects in the book are here:  http://www.appinventor.org/bookFiles  

How to do a lot of basic things with App Inventor are described here:  http://www.appinventor.org/content/howDoYou/eventHandling  .

Also do the tutorials http://appinventor.mit.edu/explore/ai2/tutorials.html to learn the basics of App Inventor, then try something and follow the

 Top 5 Tips: How to learn  App Inventor

You will not find a tutorial, which does exactly what you are looking for. But doing the tutorials (not only reading a little bit) help you to understand, how things are working. This is important and this is the first step to do.

Taifun

---

Trying to push the limits of App Inventor! Snippets and Tutorials from Pura Vida Apps by  Taifun.