WebView for iOs

[Cauê Waneck]

Hey guys,

I've just pushed the core of the webview library I was working on: https://github.com/waneck/croxit . There you will find some examples that will guide you through the features.

It's also available at haxelib with the name croxit-1.

There are still lots of plugins I need to sync (geolocation, camera manipulation, etc), in special the one that gives NME support. I'll do it as soon as I can.

Cheers!

Cauê

[Michael Cann]

Nice Caue!

So if I understand correctly, this is basically phonegap for haxe? I assume this doesnt work on the flash target?

Mike

Cauê

--
To post to this group haxe...@googlegroups.com
http://groups.google.com/group/haxelang?hl=en
 
 
 

--
Mike Cann
http://www.mikecann.co.uk/

@mikeysee

[Cauê Waneck]

So if I understand correctly, this is basically phonegap for haxe?

 

yes,

It's phonegap for Haxe, with one big advantage: it allows you to work with a client/server logic (in contrast to phonegap where everything needs to be done by js).

And its Web api is based on Neko's, which means that you can cross compile to web and mobile :)

 

I assume this doesnt work on the flash target?

For now I've only implemented the iOs target. In special the NME part will be really tricky to support on the other targets, since I abused from the fact that we are compiling everything as a static library :)

But anyway, the basics will be very easy to do for Android on Haxe/Java, so soon I'll implement it as well!

[Postite]

Awsome it's been a i   wanted to do such things like bakerframework 
http://bakerframework.com/  with  haxe.

Thanks

--

[Michael Cann]

Wow, sounds really powerful Caue, nice work. Will have to give it a play before I can grok its full potential :)

[Joshua Granick]

Would you be interested in helping integrate camera and geolocation into NME directly?

[Philippe Elsass]

Can it be used for overlaying an occasional online content like a login or sharing form and still allowing regular NME display?

Philippe

[Francois Nicaise]

great! bravo:)

Thinkslow 

Cross- platform gaming experiments 

Http://thinkslow.net

Http://blog.thinkslow.org

--

[Raphael Harmel]

Bravo sir Caue !

Raph

2012/8/30 Francois Nicaise <white...@gmail.com>

[Valerie Elimak]

Looks promising!

Valerie Alloix

+31633042131

Blog - @elimak

[Cauê Waneck]

Thanks guys! :)

I really hope it's going to be useful for you, it was very useful to me!

2012/8/30 Joshua Granick <bulk...@joshuagranick.com>

Would you be interested in helping integrate camera and geolocation into NME directly?

Sure, Josh! I would be happy to do it. The problem, though, is that sometimes in UIKit you need to get some info that I really don't have access on NME. For example, for geolocation to work correcly for my use case (maps + navigation), I needed to detect when the app went to the background and call a function to keep receiving data whilst on the background. For this, I'd need access to AppDelegate's willResignToBackground (or something like that), which I really can't access if the application wasn't started by me. There was a similar problem with getting the main UIViewController, since it seems (as far as I remember) that NME doesn't set it as the main view controller (which can be accessed from any place).

What I made for the first problem was to create a plugin-friendly global event dispatching system. So e.g. all events from AppDelegate are dispatched, so the plugins can handle it the way they want: https://github.com/waneck/croxit/blob/master/haxelib/native-project/native/iPhone/croxit.mm#L503

This was also the way I was able to create an NME context on iOs - if NME was active, I would listen for such events and call animation to stop there.

If you're interested in implementing something like this, I would be happy to work on a patch for NME and include my plugins! Also for most other targets we'll probably need some changes in NME core to be able to alternate between showing the webview contents and the NME contents

2012/8/30 Philippe Elsass <philipp...@gmail.com>

Can it be used for overlaying an occasional online content like a login or sharing form and still allowing regular NME display?

 

You won't be able right now to show both at the same time, since NME window is opaque (for performance reasons), and always occupies the entire screen. But you are able to e.g. some point in the game, pause it, show the webview navigation, and at any time close it again and resume with NME

[Marcelo de Moraes Serpa]

Wow Cauê, looks promising! I was starting to play with Cordova and Haxe (by compiling Haxe to JS) but looks like I'll have to put it aside :)

Ótimo trabalho!

Saudações,

- Marcelo

--

[Philippe Elsass]

Caue, that's perfectly ok if it's simple to switch from NME to the webview (and back) :)

--
Philippe

[Cauê Waneck]

2012/8/30 Philippe Elsass <philipp...@gmail.com>

Caue, that's perfectly ok if it's simple to switch from NME to the webview (and back) :)

So you'll be fine! :) I just need to polish the nme plugin to make it available also. Will try to do it this weekend, then I'll post a facebook example ;)

One thing you can also do is to show everything on the webview, and make a js script that calls NME, which renders the content to a JPG and sends back the link location ;) I did this for a project and it worked great!

 2012/8/30 Marcelo de Moraes Serpa <fullofc...@gmail.com>

Wow Cauê, looks promising! I was starting to play with Cordova and Haxe (by compiling Haxe to JS) but looks like I'll have to put it aside :)

Ótimo trabalho!

Saudações,

- Marcelo

:) Thanks, Marcelo! I'll be happy to help if you need anything!

Obrigado!

Cauê 

[Philippe Elsass]

Ha, rendering the scene as an image could be a nice trick to keep a static view of the NME window in the background maybe - is it possible to freely capture the stage like that?

--

To post to this group haxe...@googlegroups.com
http://groups.google.com/group/haxelang?hl=en
 
 
 

--
Philippe

[Cauê Waneck]

2012/8/30 Philippe Elsass <philipp...@gmail.com>

Ha, rendering the scene as an image could be a nice trick to keep a static view of the NME window in the background maybe - is it possible to freely capture the stage like that?

it's not so free, since you need a readback to texture (e.g. to do it every frame), but it's fast enough!

Something like:

var bdata = new BitmapData(stageWidth,stageHeight);

bdata.draw(Lib.current.stage);

File.saveBytes(myTemporaryPath, bdata.encode("png"));

I'd totally avoid passing the bytes to javascript, though - so saving to a temp path is the best way to do it.

In my case, I was rendering a map using NME, so it changed with little frequency, so I'm not sure the throughput you'd get with this method!

[Marcelo de Moraes Serpa]

I'm a little lost on what you guys are talking about. What is that use-case about? :)

- Marcelo

--

[Cauê Waneck]

Use case is if you'd need to "embed" an NME view inside the webview. 

What Philippe is talking about is if e.g. you are in the game and you click on "share on facebook", which would open the croxit webview to facebook (in an iframe for example).

If you want to keep your NME game as a background, you could e.g. render from NME to a texture, and pass this texture to JS.

I'm not sure how this would work if you want e.g. animation to be rendered using this method. I guess it wouldn't work very well.

My own use case was a map navigation interface. JS would request a map tile to NME, and NME would render it to a texture, and pass its path to JS. It worked very smoothly, and would be a real pain to do it on phonegap!

2012/8/30 Marcelo de Moraes Serpa <fullofc...@gmail.com>

I'm a little lost on what you guys are talking about. What is that use-case about? :)

[Marcelo de Moraes Serpa]

Oh nice! Thank you for clarifying. 

- Marcelo

[Cauê Waneck]

Crazy thought has passed by -

maybe an nme target that's a hybrid of JS and CPP could be made? So e.g. positioning is handled by Js' CSS transform, and vectors could be requested to be rendered by cpp? The bad thing about this is that since the communication is asynchronous, vector animation would suffer (considerably). But for more static vector positioning, it could work rather smoothly!

[Michael Bickel]

Looks very promising! Bravo!

Lemme add another crazy idea - support for webgl. 

Here is some food for thought on the topic: http://stackoverflow.com/questions/6313768/deploy-webgl-applications-as-native-ios-or-android-applications

- Michael

[Hugh]

Cauê,

Is is pretty much how the "NaCl"/pepper code is going to end up.

Hugh

[Cauê Waneck]

2012/8/31 Hugh <game...@gmail.com>

Cauê,

Is is pretty much how the "NaCl"/pepper code is going to end up.

Really? 

Is it planned to be supported? That's awesome!

2012/8/30 Michael Bickel <michael...@gmail.com>

Looks very promising! Bravo!

Lemme add another crazy idea - support for webgl. 

Thanks, Michael!

But webgl seems to me a dead end: Using the private API described would render the app banned from the Apple Store, and implementing it via cpp communication would need a lot of slow serialization, readbacks, etc :)

In this manner, I think the best way to achieve a webgl-like API would be to provide support for direct opengl manipulation on hxcpp/NME, and use hscript to be able to easily script with it (though it would be slow to interpret)

[Philippe Elsass]

I didn't mean to keep an animated version of NME in the background of the webpage, but just one static image :)

--

To post to this group haxe...@googlegroups.com
http://groups.google.com/group/haxelang?hl=en
 
 
 

--
Philippe

[Joshua Granick]

I would be happy to work with you, to help make sure NME supports what you need.

Ideally, you should be able to add an "include.nmml" file that specifies your dependencies or other flags you need when building a project, then we should have what you need exposed so it is uncomplicated to integrate :)

If we can display a WebView over your NME content, with both active, would be the ideal, but if we need to freeze the NME render and display a fullscreen WebView over the top, I am sure it will work for a lot of use cases

[Dion Whitehead Amago]

Does the webview use JS compiled from Haxe?

If not, would you consider this as a possibility?  Javascript run in a webview allows you to update the game or app legally 'over-the-wire', without having to go through the resubmission process.  As someone working on a large-scale client-server mobile and flash game, this ability would be awesome to have, and currently is only implemented in Spaceport.io. This also allows you to push and reload the game without having to go through a recompilation process, greatly speeding up dev time.

Dion

[Marcelo de Moraes Serpa]

Does the webview use JS compiled from Haxe?

Good question! +1

 As someone working on a large-scale client-server mobile and flash game, this ability would be awesome to have, and currently is only implemented in Spaceport.io. This also allows you to push and reload the game without having to go through a recompilation process, greatly speeding up dev time.

It's the model used by https://trigger.io/. I didn't know about Spaceport, but it looks like it's geared towards games  while trigger is for business apps. I might be totally wrong here, and it might be only the difference in the way they market their respective products. 

Anyway, we at least know croxit is agnostic is this sense, being good for both mobile business apps (something that was lacking in the Haxe eco-system) and games as well (taking advantage of the NME stack?).

- Marcelo

[Cauê Waneck]

Hey guys!

Quick update: Yesterday I've released the camera and the geolocation modules. I still have some work to do on both, specially to be able to mock interfaces from a neko webserver, when still using Camera and Geolocation - so it has still a little unstable api. Notifications and NME will come next!

2012/8/31 Joshua Granick <bulk...@joshuagranick.com>

Ideally, you should be able to add an "include.nmml" file that specifies your dependencies or other flags you need when building a project, then we should have what you need exposed so it is uncomplicated to integrate :)

Wow, how does that work? Currently I'm using nme's build tool and I need to ask users to add a "template" path to their nmml. Does 'include.nmml' work already? And also - how would I get the haxelib path of croxit from nmml? (to specify the correct template path) ?

 

If we can display a WebView over your NME content, with both active, would be the ideal, but if we need to freeze the NME render and display a fullscreen WebView over the top, I am sure it will work for a lot of use cases

We can display them both already (i still need to publish the nme integration module :) ), but since both currently occupy the whole screen on ios, there is no reason why to keep them both active, so normally you'd stop one of them :)

By the way, one of the intended features is to be able to add more than one webviews, so we can e.g. spawn a facebook share more easily.

2012/9/1 Dion Whitehead Amago <dio...@gmail.com>

Does the webview use JS compiled from Haxe? 

What do you mean? You can communicate both from js to cpp and from cpp to js with Haxe remoting. Here's an example:  https://github.com/waneck/croxit/blob/master/haxelib/examples/05%20-%20JavaScript%20Communication/

With this, one could probably make the bindings to make JS "control" a cpp/nme backend, I guess. Though it wouldn't be too easy, specially since I'm not sure there is a way to communicate synchronously with cpp from js. Need some tests for this!

If not, would you consider this as a possibility?  Javascript run in a webview allows you to update the game or app legally 'over-the-wire', without having to go through the resubmission process.  As someone working on a large-scale client-server mobile and flash game, this ability would be awesome to have, and currently is only implemented in Spaceport.io. This also allows you to push and reload the game without having to go through a recompilation process, greatly speeding up dev time.

That sounds like a great use case! But I still have a little hard time to think how it could be done? Also AFAIK Apple's restrictions aren't with interpreted languages (be it js or any other), but with downloading executable content. So is it really ok to have downloadable js to control a native app part?

2012/9/1 Marcelo de Moraes Serpa <fullofc...@gmail.com>

It's the model used by https://trigger.io/. I didn't know about Spaceport, but it looks like it's geared towards games  while trigger is for business apps. I might be totally wrong here, and it might be only the difference in the way they market their respective products. 

Very cool!!! I didn't know about them, seems a little crazy how they use native UIs together with HTML rendering. Will look into it! 

Anyway, we at least know croxit is agnostic is this sense, being good for both mobile business apps (something that was lacking in the Haxe eco-system) and games as well (taking advantage of the NME stack?).

Yes! I think that croxit will be able to leverage business interfaces, and specially mix those interfaces with the great NME graphics performance! :)

Cheers! :)

Cauê

[Marcelo de Moraes Serpa]

Cauê, 

Did I say this is so freaking awesome?

I've heard cocktail could do something similar, but I think it's too high-level, and the markup generated seems quite polluted. I was starting to look into PhoneGap into a quick and efficient way to develop mobile applications (not games, not into them, yet!), but you just got me hooked there, pal! 

We once had a discussion in this very same list about creating business mobile apps with Haxe and it was pretty inconclusive. Now, with croxit, I think it's finally viable, and If you need native look and feel, you can always use something like JQuery Mobile; also, perhaps it wouldn't be too hard to create a native UI control binding now that we have the framework for that? 

Anyway, big kudos to you Cauê, this is truly awesome (and inspiring!), and the basis for much more awesomeness yet to come, I'm sure! :)

- Marcelo

--

[Dion Whitehead Amago]

2012/9/1 Dion Whitehead Amago <dio...@gmail.com>

Does the webview use JS compiled from Haxe? 

What do you mean? You can communicate both from js to cpp and from cpp to js with Haxe remoting. Here's an example:  https://github.com/waneck/croxit/blob/master/haxelib/examples/05%20-%20JavaScript%20Communication/

With this, one could probably make the bindings to make JS "control" a cpp/nme backend, I guess. Though it wouldn't be too easy, specially since I'm not sure there is a way to communicate synchronously with cpp from js. Need some tests for this!

This sounds like a possibility, although since it uses haxe remoting there might be some serialization overhead.  Synchronous communication would not be necessary, since you could just update every frame.

Basically, you would only need to map display objects from the JS world to the NME world, and to explicitly call some destroy method from the JS Sprites so they could be cleaned up in the NME world.

I imagine the updated transforms in the JS world could be batched together, so you could have one remoting update call per frame.

That sounds like a great use case! But I still have a little hard time to think how it could be done? Also AFAIK Apple's restrictions aren't with interpreted languages (be it js or any other), but with downloading executable content. So is it really ok to have downloadable js to control a native app part?

Although this may change in the future, apple doesn't allow any executable content to be downloaded, with the single exception of Javascript run in a webview, since this environment is "trusted", I presume.  

[Joshua Granick]

Would you be able to update Neko-based applications "over the wire"?

If so, then making a NekoVM build for iOS might be an even better solution. That will still give native rendering performance, and could be a good opportunity for PC and Linux developers who don't want to be forced to use a Mac

On Sat, 01 Sep 2012 14:16:34 -0700, Marcelo de Moraes Serpa <fullofc...@gmail.com> wrote:

Does the webview use JS compiled from Haxe?

Good question! +1

 As someone working on a large-scale client-server mobile and flash game, this ability would be awesome to have, and currently is only implemented in Spaceport.io. This also allows you to push and reload the game without having to go through a recompilation process, greatly speeding up dev time.

It's the model used by https://trigger.io/. I didn't know about Spaceport, but it looks like it's geared towards games  while trigger is for business apps. I might be totally wrong here, and it might be only the difference in the way they market their respective products. 

Anyway, we at least know croxit is agnostic is this sense, being good for both mobile business apps (something that was lacking in the Haxe eco-system) and games as well (taking advantage of the NME stack?).

- Marcelo

On Saturday, September 1, 2012 at 1:39 PM, Dion Whitehead Amago wrote:

Does the webview use JS compiled from Haxe?

[Cauê Waneck]

2012/9/1 Marcelo de Moraes Serpa <fullofc...@gmail.com>

Cauê, 

Did I say this is so freaking awesome?

 

Hey Marcelo! 

Thanks! :) I'm really happy to know it'll be useful for other people as well!

 

I've heard cocktail could do something similar, but I think it's too high-level, and the markup generated seems quite polluted. I was starting to look into PhoneGap into a quick and efficient way to develop mobile applications (not games, not into them, yet!), but you just got me hooked there, pal! 

 

Cocktail also has a lot of merit, since it achieves a much harder function, which is to bring CSS into NME!  :)

But I agree that for practical needs, a WebView may solve it better!

 

Anyway, big kudos to you Cauê, this is truly awesome (and inspiring!), and the basis for much more awesomeness yet to come, I'm sure! :)

Thank you for your kind words, Marcelo! I was also inspired by the great work of this community :)

And if you feel like contributing, it'll be very appreciated! Also any feedback will be great !:)

2012/9/2 Dion Whitehead Amago <dio...@gmail.com>

This sounds like a possibility, although since it uses haxe remoting there might be some serialization overhead.  Synchronous communication would not be necessary, since you could just update every frame.

It seems to me that the overhead is inevitable, if we have a native part - serialization is always needed to communicate. What would be needed, though, would be a synchronous communication, since without it we couldn't really control anything!

Basically, you would only need to map display objects from the JS world to the NME world, and to explicitly call some destroy method from the JS Sprites so they could be cleaned up in the NME world.

I think the best way to achieve that would be to implement  cpp.Loader.load() / loadLazy / etc into js, which would call remoting and call the actual native cpp.Loader ! It could work surprisingly well, and transfer the whole NME part to js! It's something that would be definately worth trying, though I'm truly lacking time to do it ! :)

2012/9/2 Joshua Granick <bulk...@joshuagranick.com>

Would you be able to update Neko-based applications "over the wire"?

I'm afraid Apple doesn't allow us to do it in the final build. I'm thinking though of creating a neko vm inside croxit, to be able to add .n files there, and quickly prototype applications/reupload contents as needed (without needing to recompile) 

If so, then making a NekoVM build for iOS might be an even better solution. That will still give native rendering performance, and could be a good opportunity for PC and Linux developers who don't want to be forced to use a Mac

I'm still trying to figure out a solution for that as well :)