Wrapping a HTML5 app into an executable for Windows/Linux/Mac - html

I'm building a HTML5 mobile app which I'm going to wrap in an Android and an iOS app with a simple web view. However, I have some users that use my current Adobe Air app (which is now unsupported), and I'd like to offer them this new app I'm building.
I've heared that Adobe Air's implementation of webkit is rather old and unstable.
Is there any good tools for wrapping a local browser (preferably webkit) and my app in an executable for cross-platform (PC) use?

I've just seen this http://appjs.org/ and I'm glad to see that Alex's TideSDK sounds great also !
Adobe AIR can do what you want, but I won't support that solution : it's slow and not really crossplatform since they drop the support on Linux if I'm correct.
If someone happen to test the others, feedback is welcome !
Off topic: Moreover I've chosen not to trust Adobe for my technical choices anymore. We've waited Flash on mobile for years, they drop the idea. We've been waiting for optimization on Mac and Linux for years, but nobody cares. The new hype some months ago was expecting compilation to HTML5, it's just some buzzwords mixed together and some old sketchy alpha version as far as I know.
EDIT
AppJS has moved http://appjs.com/
EDIT
node-webkit seems to be definitely a must see now ! https://github.com/rogerwang/node-webkit

Read an article lately about this sdk: http://www.tidesdk.org/ . I haven't worked with it yet - so can't really say if it's worth trying and doing what you want.

Related

TCL/TK in browser

I've been trying to run a TCL/TK script in a browser so people with minimal computer knowledge can run it (my script) on all devices.
I've come across the TCL/TK plugin from 2006 but I can't get it to work. Even if I could, it doesn't contain the user friendliness I am looking for.
I also came across a website that runs TCL scripts in-browser but doesn't seem to recognise TK commands....
So far to distribute it to people I wrapped it into a .exe but people are requesting it to be used on mobile devices (with more mobility than a windows laptop).
Any one got some information to do this without rewriting all of my code?
Or an easy way to port a TCL/TK script to iPhone/iPad or Android (I don't think there will be any easy solution for this, that is why the browser concept made most sense to me)
Unfortunately, the browser plugin depends on the browser supporting the NPAPI specification, and that's now been largely removed from browsers (and was never supported on mobile devices). This has irritated quite a few other people too, and I don't think there's much you can do to fix it directly. So instead, let's look at some workarounds…
You might be able to use the NaCl support in Chrome on desktop systems, or you could package things up in a starpack (ActiveState's TDK is a commercial version of that, among other things) and for deployment to Android you can use Androwish (which I personally recommend). I'm nothing like as certain about solutions for iOS.
For plain Tcl try EmTcl, Tcl compiled with emscripten.

What are the functional differences between NW.js, Brackets-Shell and Electron?

Now that TideSDK is effectively dead, I've been looking into alternative 'wrappers' to run HTML/CSS/JS applications as stand-alone desktop applications. The three viable options I have run across so far, are NW.js (formerly node-webkit), brackets-shell, and Electron (formerly atom-shell).
The problem is that there does not appear to be a sufficiently complete comparison between the three in terms of feature set, compatibility, etc. I'm hoping to turn this into a more-or-less canonical thread on the (objective) differences between the three, in particular regarding:
Platform support; operating systems, dependencies, etc.
Language feature support, as far as HTML5, CSS3 and JavaScript are concerned. Think things like "does HTML5 video work, and if yes, what codecs are available?"
Non-standard extra features, such as tray icons, popup notifications, and OS-rendered menu bars.
Extensibility; eg. ability to 'plug in' native code, talk to Node.js, and so on.
Architecture; in particular the architectural differences that affect daily usage as a developer.
Debugging; included development tools, compatibility with commonly used tools like node-inspector, etc.
... and so on.
What are the objective, technical differences that matter when making a choice between them as an application developer?
I did similar research about two months ago, and in the end I went with node-webkit. The biggest upside on node-webkit is node.js and npm. The package management of npm is really nice, and node has well done filesystem access.
Brackets-shell looked interesting, but other than a nice IDE I didn't really get what made this one as good or better than the rest. They are very clear that "The brackets-shell is only maintained for use by the Brackets project ", that screams run away to me.
https://github.com/adobe/brackets-shell#overview
Atom-shell seems to be recently active, but it seems much like brackets in that they are really writing and editor/IDE that just happens to be attached to a webkit runtime. It also is built on top of node.js. This one has the downside of being difficult to search for stuff online without being reminded of your middle school chemistry.
I really don't want an new editor, and most programmers have their favorite already. For the actual application development, they pretty much work the same, and should, since they all use webkit. You basically write 90-95% of it like a website, and then deal with the native parts, and some config.
These things are true for all three of them
platforms - runs on Windows, Mac, and Linux
language support - HTML5, CSS3 and Javascript : since they run javascript you can download and run nearly any library/framework that you want.
The big caveat on webkit is codec support. Typically you will have problems with non-free video codecs, unless you rebuild the dll/so to support them. For example the shipped node-webkit won't play mp4 video.
I've been playing with Atom-Shell over the last few days, and I am loving it so far.
The best part about it is that it's backed by GitHub.. which should allow you to settle into the platform for the long term, especially if it gains a large following. It's also made possible by direct Node.js improvements courtesy of a contract with StrongLoop, who is a major Node.js contributor (they claim to employ more Node.js core developers than any other company, even Joyent).
I've also found it rather comfortable to get started. It took me about a day to learn the structure and get my first proof of concept running. Very cool.
Bullet Points:
Platform support: Windows, Linux, Mac OSX (More Info Here)
Language feature support: HTML5, CSS3, JS via Chromium - so far, zero issues, but I have not tested video specifically.
Native Features: Native App Menus, Task Tray Support, Global Hotkeys, Protocol Handler Support (that I've seen so far)
Extensibility: Excellent Node.js integration, both the client and server can "require" Node.js modules and natives. I've also successfully tested Bower libraries (incl jQuery) without issue.
Architecture: Covered in the other points, but in general its very smooth.
Update (11/25/14): I've not yet found use case for Atom-Shell in any official capacity, but I have used it to build a few small apps for my own use, the most complex being an app that pulls my time logs from my PM software and creates Paypal invoices.
My opinion of the platform remains positive. It's pretty awesome.
On my time invoicing app I successfully brought in Bootstrap 3's Dashboard Example Template and a few node modules (bluebird, Paypal SDK, Teamwork PM Client) to create a mildly complex app. It took me a few days and does its job well.
I really cannot think of anything negative to say about Atom-Shell, its solid, stable, fast, and easy to code for. I hope this helps someone.
Besides fully support Web standards, NW.js supports a list of non-standard features for native app development including:
Protect JS source code by compiling them into machine code: https://github.com/nwjs/nw.js/wiki/Protect-JavaScript-source-code-with-v8-snapshot
Jailed devtools: https://github.com/nwjs/nw.js/wiki/Devtools-jail-feature
Additional security model with which you can do more in DOM: https://github.com/nwjs/nw.js/wiki/Security https://github.com/nwjs/nw.js/wiki/Changes-to-DOM
enhanced file dialog: https://github.com/nwjs/nw.js/wiki/File-dialogs
kiosk mode: https://github.com/nwjs/nw.js/wiki/The-Kiosk-mode
supports for a growing list of chrome.* API, include chrome.webRequest so you can intercept HTTP requests from DOM: https://github.com/nwjs/nw.js/issues/518
support for rich notifications, print preview, many more chrome.* APIs, Chrome Apps and other Chromium features starting from 0.13.0-alpha0
There is much more to see in the wiki including Menu, Tray, etc.
I've been working with brackets-shell for some time now, here are some of my findings:
brackets-shell is primarily developed as a shell under the brackets IDE project, but the project can run any web application. You just need to point it to your own html page. Clint Berry wrote an excellent tutorial about doing just this: http://clintberry.com/2013/html5-desktop-apps-with-brackets-shell/
The project is backed by Adobe and has a lot of activity
Documentation could be better
platform support They support Windows, Mac and Linux. An installer package can also be created. I only tested it on Win and Mac, it works great.
feature support html5, css3, js. Html5 video does not work out of the box, but is very easy to enable (by default the ffmpegsumo.dll is not copied into the installer, if you change the script to copy it it will work).
native features menu bar, 'open file with', file system access. I am not using any of these, as all I need is the communication with the node process.
extensibility a nodejs is built in, and you can communicate with node from your web application. In this way, you can use node to access the filesystem etc.
architecture The project is well set up, keeping a nice separation between the shell project and your own web app running inside it. In your own application, a global appshell object is available which gives you access to the brackets functionality (filesystem access, communication with node process, ...).
One thing to note (if you care), is that the Electron officially does not support Windows Vista. Vista's market share is about halfway between OSX 10.9 and 10.10 (both of which are fully supported by Electron). Vista is also still supported by Microsoft until 2017.
NW.js works fine in Vista, as well as OSX 10.9+. NW.js works on Ubuntu, Debian, Zorin, Manjaro, Arch, and most other Debian based Linux OS's. Electron has refused PR's to fix Ubuntu specific bugs on their platform which is concerning.
NW.js works in XP too. Currently 18% of the market is still on XP. So if you're desktop application is more general purpose or wants to have access to the late adopters still on XP, you're probably better off with NW.js (0.14.7) as Electron only supports Win 7 and up.
If you use NW.js 0.12.3 you can also support OSX 10.6+ and very old versions of Debian based Linux OS's like Ubuntu, and Win XP+. It is recommended that you do special builds just for those legacy systems though and use the newer versions of NW.js for newer OS's.

Confusion regarding PhoneGap/Cordova

I have a webapp developed (game), based on HTML5 + CreateJS, but since Android lacks of standards, I've run into unsolvable issues for my webapp. That's why im recurring to PhoneGap.
Yet my confusion lies in the fact that I need to make this game into a phonegap app that runs on Android/iOS, using for each platform native specific stuff.
So, should I build 2 apps (one for each platform), all over again, or use the one I have and try to deploy it into different devices using phonegap?
The truth is I don't know how to approach this problem... can anyone help?
Best Regards.
Yes, you can use Cordova (PhoneGap) to create a cross platform mobile app. Basically, Cordova (PhoneGap is Adobe's version of Cordova) is an open source project that provides JavaScript API's for accessing native device functionality (like the Accelerometer or Camera.) Cordova also lets you package your app in the native application shell, so you put your app on the app store. Please see my other answer here about Cordova and hybrid apps: Beginning with Apache Cordova
If the game runs completely in HTML5, I think it would be easiest to just use that one codebase and integrate it with Cordova and then deploy to the various platforms - why rewrite the app twice if you don't need to?
However, if you are using native device functionality, you may need to develop your own Cordova/Phonegap plugins for use. This way, you can call regular Android/iOS code (Java or Objective-C code) that you write from your web app code with JavaScript. This might be more work, especially if you have never written in these languages.
Personally, since you already have a working HTML5 app, I'd just try to get it working with Cordova and see how it performs. If you really need some native specific stuff, then I'd try creating that "stuff" as a plugin. Rebuilding the app twice, once for Android and once for iOS seems like a pretty big waste of time to me.
The answer here is either yes or no.
Yes if you want to use some specific feature of the native code. For instance, iOS's default objects is beautiful itself, you can easily drag and drop it to build your application. However, it takes lots of time to rebuild for another platform. Specially, if you intend to create app/game for multiple platforms, it would be a nightmare.
HTML5 is much faster for you to approach several platforms. However, you can't get the best result on all platforms and all devices. I mean, it is really difficult to bring the max performance of the app on all devices. For this solution, I suggest HTML5 with some libraries such as LimeJS, Crafty, Impact, etc. or some tools such as Construct 2, etc. I used to use HTML5 with all those libraries but found out that Construct 2 is much better.
Instead of using phonegap, I recommend cocoonjs. Specially if your targets are iOS and Android platforms.
Hope that help.
Yeah, even the simplest game such as bubble buster would be difficult to make cross platform with different version of android webview and you need cross platform? I would suggest looking into something like Unity3D.

objective j loads slowly in browsew

I am iOS developer. I know just a couple of languages and I hate html because of the lack of possibilities there.. I've just red about objective-j. When I try to open any code in web browser (last versions of Safari, Google Chrome) it loads increadibly slow..
Is it normal?
How to make it work fast?
Are there any other languages similar to c, objective-c that I can use for creating a web-site?
And another queastion coming with: How can I make Xcode work with objective-j? I use coda 2.0 at the moment.
Make sure you run jake deploy to create the stripped and precompiled version of the app you're testing. Most sample code out there will be run in uncompiled "debug" mode which is great when you're developing but in actual deployment you'll want the precompiled version of your app.
Also, the current development version of Cappuccino and Objective-J is much faster than the last release 0.9.6, thanks to a new, better compiler. Keep an eye out for a future Cappuccino 0.9.7 release.
I think if you write a significant app in Cappuccino you'll find the load time to be absolutely comparable with other large web apps such as Gmail.
Currently you can only use Xcode to edit the user interface of a Cappuccino app. It does not work well to edit Cappuccino code itself since the latest versions of Xcode don't include the necessary plugin framework. You can learn more about good editor options in the development environment tutorial.
I am not familiar with other languages similar to Objective-C for the web, but Intel has an Objective-C to JavaScript compiler here.

A versatile yet simple gaming development platform for a rather beginner?

I am interesting in game development. However, I am not sure what platform to choose. There are a few different platforms I have been considering so far:
Microsoft XNA
Games only work in Windows and Xbox?
JavaScript and WebGL
Bad performance. This is mainly due to JavaScript -- the language is essentially synchronous and even timers do not run asynchronously. The only good way to use JavaScript would be to utilize Web Workers, which complicate the development quite a lot.
Flash
A dying technology that I personally dislike and unsupport.
C++ and OpenGL
Cross-platform compliant all the way, but very hard to develop games.
Am I missing anything worth considering? What I am looking for is a simple yet enough powerful to make 2d and basic 3d games and being able to run it on as many platforms as possible.
Also, is it possible to run XNA games on Linux/Mac? What about mobile?
You should probably look at a framework that allows the use of Java/C++ but takes away some of the pain.
For C++ take a look at Ogre.
For Java take a look at jMonkeyEngine.
If you're going to be targeting mobile devices incl. iPhone/iPads too look at something like Unity/Unity Pro which supports JavaScript, C# and a dialect of Python and can publish out to multiple platforms.
You'll get better answers in https://gamedev.stackexchange.com/
If you don't mind spending some money, you might want to look at Torque.
For anything advanced you'll need to use C++, but for simple games, the TorqueScript is fine. They currently support Windows, Mac and iPhone/iPad, athough the Mac and iPhone/iPad support is usually less than the Windows support. But still pretty good for most things.
You can also publish the PC games to the web browser with their ActiveX and NP browser plugins.
They also support some consoles. For XBox they have a version of the engine that is built on top of XNA, and you can also get a version that is built on top of the native XBox SDK. I believe they've also gotten it going on PS3 as well. For the XBox and PS3 native stuff, you're going to be looking at some real money though.
WebGL and Javascript and canvas are getting a lot faster now, thanks to typed arrays and native animation support and hardware rendering, see for example:
https://hacks.mozilla.org/2010/08/more-efficient-javascript-animations-with-mozrequestanimationframe/
(download the nightly version of firefox minefield to try it out)
There are various webgl game frameworks available already (see the 'learning webgl' site for info).
It's not going to work on mobile/tablet platforms though probably for a good while.