The CocoonJS and Cocoon clouds are quite different. To start, the CocoonJS cloud used custom plugins developed by us with a proprietary application framework. On the other hand the new Cocoon cloud is based on Apache Cordova so you can benefit from all the Cordova community plugins and there are thousands. That was one of the main reasons to move the platform to Cordova, so you can benefit from all those Cordova plugins.
As a consequence of being based on Cordova, also the application level configurations differ between cloud services but don’t worry, you don’t have to migrate all the project configuration by hand. We have been working on this and you should get an almost completely migrated project in your projects dashboard.
All the main application parameters are automatically migrated to the Cocoon project so you don’t have to worry with the main settings like: name, bundle id, version, version code, orientation and splash scale method. There are only a few things missing that you have to do to have a completely working project in the new Cocoon cloud.
In the old CocoonJS cloud there was a setting to automagically scale you application to a predefined scaled method. It only worked for Canvas+ so if you were developing for the system webview or Webview+ you probably don’t have to worry about this.
As this is not standard and is not supported in other webview engines like the system webview or webview+ , this setting no longer exists in the new Cocoon cloud. Now you can use standard features like the
viewport meta tag and css styles to scale and place your canvas.
For example you could make your canvas scale aspect fit with using following code:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
Your browser does not support the HTML5 canvas tag.
var W = H = 1000;
var scale = Math.min(window.innerHeight/H, window.innerWidth/W);
var canvas = document.getElementById('myCanvas');
canvas.style.position = "absolute";
canvas.style.width = (W * scale) + "px";
canvas.style.height = (H * scale) + "px";
canvas.style.left = (window.innerWidth * 0.5 - W * scale * 0.5) + "px";
canvas.style.top = (window.innerHeight * 0.5 - H * scale * 0.5) + "px";
var ctx = canvas.getContext("2d");
ctx.rect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = "red";
Apart from this there is not much more to migrate in the general settings. So if you have an application without plugins, fixing the scaling should be enough for your project to work fine in the new Cocoon cloud. In case you have plugins, please check the articles explaining how to migrate each plugin, it shouldn’t be difficult.
Thanks for using Cocoon!