Resizing Jangaroo Object

[Paul Tomlinson]

Hello all,

Is there a simple way to resize a jangaroo object in it's parent html
page? I'm building a HTML5 app which needs to run on both iPhone &
iPad.

My object was generated with actionscript but since I'm defining the
object height & width in the SWF meta tag, I'm finding it impossible
to resize via CSS or Javascript.

Thanks in advance,

Paul

[Frank]

Hi Paul, sorry for the late response, I'm quite busy with the next
Jangaroo release these days.
Yes, it is quite annoying that JooFlash apps cannot be resized
dynamically, but of course it was easier to build for the special
case of fixed size as a first shot. Give me some time to dig into
the problem, maybe there is a workaround for your special case.
I guess computing the size once at app start would suffice for you?
Greetings,
-Frank-

[Paul Tomlinson]

Computing at the start would be fantastic.

Thanks Frank!

[Frank]

Okay, now here is how computing the desired size at start-up time
can be achieved.
Create a custom start-up class, e.g. top-level class "Main" that
tweaks the size and delegates to joo.flash.Run:

package {
import joo.DynamicClassLoader;
import joo.JooClassDeclaration;
import joo.flash.Run;

public class Main {

public static function main(id:String,
primaryDisplayObjectClassName:String, parameters:Object):void {
var classLoader:DynamicClassLoader =
DynamicClassLoader.INSTANCE;
classLoader.import_(primaryDisplayObjectClassName );
classLoader.complete(function():void{
var swfMetadata:Object =
JooClassDeclaration(classLoader.getRequiredClassDeclaration(primaryDisplayObjectClassName )).metadata['SWF'];
// patch the [SWF] annotation:
swfMetadata.width = 1280; // set computed width here
swfMetadata.height = 960; // set computed height here
Run.main(id, primaryDisplayObjectClassName , parameters);
});
}
}
}

Now, in your bootstrap HTML, instead of calling "joo.flash.Run"
directly, call "Main"
with the same parameters, e.g. instead of

<script type="text/javascript">
joo.classLoader.run("joo.flash.Run", "stage", "FlxInvaders");
</script>

use

<script type="text/javascript">
joo.classLoader.run("Main", "stage", "FlxInvaders");
</script>

To get the screen width and height, you can use
window.screen.availWidth and window.screen.availHeight.
Would be great to hear if that worked out!
Greetings
-Frank-

[Paul Tomlinson]

Hi Frank,

Thanks for this. Unfortunately, my amends only result in 'Jangaroo
Flash Application not (yet) loaded'.

The mvn package runs successfully, but when I place alerts in jooflash-
app-template.classes.js, it looks as if my _mainStart() function is
not being called.

I've just added your code to my working actionscript as follows:

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

package {
import flash.display.Sprite;
import flash.text.TextField;
import caurina.transitions.Tweener;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.Loader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.external.ExternalInterface;
import flash.utils.Timer;
import flash.system.Capabilities;

import joo.DynamicClassLoader;
import joo.JooClassDeclaration;
import joo.flash.Run;

//[SWF( backgroundColor='0x000000', frameRate='30', width='1024',
height='768')]
public class Main extends Sprite {

private var _imgArray:Array;
private var _imgNum:int = 0;
private var _holder:Sprite;
private var _game:Sprite;
private var _myLoader:Loader;
private var _splash:Sprite;

//public function Main() {

public static function main(id:String,
primaryDisplayObjectClassName:String, parameters:Object):void {

// New

var classLoader:DynamicClassLoader = DynamicClassLoader.INSTANCE;
classLoader.import_(primaryDisplayObjectClassName );
classLoader.complete(function():void{

var swfMetadata:Object =
JooClassDeclaration(classLoader.getRequiredClassDeclaration(primaryDisplayObjectClassName )).metadata['SWF'];

// patch the [SWF] annotation:
swfMetadata.width = 1280; // set computed width here
swfMetadata.height = 960; // set computed height here
Run.main(id, primaryDisplayObjectClassName , parameters);

});

}

public function _mainStart():void{

_imgArray = ['home.png', 'blank.png', 'back.png', 'blank.png',
'back.png', 'blank.png', 'back.png', 'peek_title.png', 'back.png'];

_holder = new Sprite();
addChild(_holder);

_splash = new Sprite();
_holder.addChild(_splash);

_addSplashScreen();

}

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
And I've amended my jooflash.html to read:

<script type="text/javascript">
joo.classLoader.run(
"Main",
"stage",

"_mainStart");
</script>

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Any suggestions what I'm doing wrong?

Thanks,

Paul

On Mar 17, 1:22 pm, Frank <frank.wienb...@coremedia.com> wrote:
> Okay, now here is how computing the desired size at start-up time
> can be achieved.
> Create a custom start-up class, e.g. top-level class "Main" that
> tweaks the size and delegates to joo.flash.Run:
>
> package {
> import joo.DynamicClassLoader;
> import joo.JooClassDeclaration;
> import joo.flash.Run;
>
> public class Main {
>
>     public static function main(id:String,
> primaryDisplayObjectClassName:String, parameters:Object):void {
>         var classLoader:DynamicClassLoader =
> DynamicClassLoader.INSTANCE;
>         classLoader.import_(primaryDisplayObjectClassName );
>         classLoader.complete(function():void{
>             var swfMetadata:Object =

> JooClassDeclaration(classLoader.getRequiredClassDeclaration(primaryDisplayO bjectClassName )).metadata['SWF'];

[Frank]

Hi Paul,

the error is that "_mainStart" is a function (method), but should be
the fully-qualified name
of your Flash "main" class (the one extending Sprite).
I would not recommend to mix the bootstrap "Main" class and your
application main class in one class.
Try to keep your class as before, and add the "Main" class from my
post. Where I put "FlxInvaders",
insert the fully-qualified name of your Flash main class.
In contrast to Flash, Jangaroo applications do not have to inherit
from Sprite, but have to have a static
"main" function similar to Java. joo.flash.Run is the adapter from
Jangaroo (main method) to JooFlash
(instantiating some class inheriting from Sprite and adding it to the
stage). The "Main" class from my
previous post replaces joo.flash.Run, patches the new size into the
Flash main class, and then delegates
to joo.flash.Run to start the Flash main class as before.

Greetings,
-Frank-

[Paul Tomlinson]

Hi Frank,

Thanks - that makes sense. I've now added your Main class to the
library, renamed my main class to Start & recompiled.

I'm now getting a Javascript error when I run the html stating
'Uncaught TypeError: Cannot set property 'width' of undefined'

It appears to be referring to swfMetadata.width. Why is this?

Paul

[Frank]

Probably your [SWF] annotation in your "Start" class is still
commented-out?
My code just tweaks the annotation, but it does not create
one if it is completely missing.

[Paul Tomlinson]

Thanks Frank!

Yep, I've re-added the SWF meta-tag & the page now displays correctly.

Changing the swfMetadata values enables me to crop the visible area of
my Jangaroo object.

However, it doesn't enable me to rescale the object.

Is this correct?

Paul

ps This amend works in Chrome, but just displays a blank screen in
Safari & Firefox

[Frank]

On Mar 19, 4:24 pm, Paul Tomlinson <easedownthisr...@googlemail.com>
wrote:

> Changing the swfMetadata values enables me to crop the visible area of
> my Jangaroo object.
>
> However, it doesn't enable me to rescale the object.

Maybe you use the absolute width/height somewhere else?
The jooflash-app-template puts the actual Jangaroo application into
an iframe. And this iframe has a fixed size, which is the same as the
one in the [SWF] annotation.

> ps This amend works in Chrome, but just displays a blank screen in
> Safari & Firefox

Any JavaScript errors on the console?

[Paul Tomlinson]

There were absolute values in the SWF tag of my Start class & in the
div tag on index.html.

I'm only currently testing this via the standard Jangaroo output.

It seems as if I'm just resizing the stage div tag holding the
Jangaroo object.

There's also no errors in Safari or Firefox. Weird!

Paul

[Paul Tomlinson]

Ah......I give up!

Time for Plan B - one version of the app for iPad & a smaller version
for iPhone.

Paul

On Mar 19, 3:42 pm, Paul Tomlinson <easedownthisr...@googlemail.com>

[Paul Tomlinson]

Viewport has been the best way for me to control the size. Although my
experience only applies to apps....

Paul


On Mar 20, 11:44 pm, Paul Tomlinson <easedownthisr...@googlemail.com>