Search the Community
Showing results for tags 'cocoon.io'.
Found 8 results
-
I am trying to make an android build via cocoon.io using Canvas+ The game imports json tilemap data generated by Tiled. The game works fine in the browser, it evenr works when I use cocoon.io's webview instead of canvas+ (very slow though, like 1 FPS). I understand that this is probably a cocoon.io issue, but maybe someone else had this problem? Any idea what might be wrong?
-
Dino Zoo Tycoon Technology stack: phaserjs, cocoon.io (cordova) Game handle native mobile and Google Play Store fetures like inapp purchases, fb sharing, ads system. Game is free. Google Play link: https://play.google.com/store/apps/details?id=dino.zoo.tycoon Description: Manage your dinosaurs zoo and becoome the greatest entertainment zoo owner, dino zoo tycoon. Take care of your dinosaurs, develop your zoo inflastructure, riseup your zoo popularity, manage your emploers, manage your zoo finance depends on year season. Features: - 16 dinos to buy - 6 types of buildings to develop - 4 types of marketing actions - 6 types of emploers to hire - management of zoo supply - management of zoo finance depends of year seazon - management of proper dinosaurs placement in your zoo Screenshots:
-
Hi everybody, To thank the users of this forum who helped me a lot, i put my template available to help new beginners or someone else. This template offers : correct scaling without stretching effect portrait mode (for landscape mode you must invert width and height) works with cocoon in webview+ and canvas+ mode (deviceready implemented) upload the file source.zip in cocoon.io and run it. https://cocoon.io/ NOTICE for canvas+, avoid this syntax, that don't work in canvas+, in webview and webview+ no problem let variable; const anothervariable; var myFunc=()=>{} and prefer this: var variable; var myFunc = function(){}; simple example with prototype and inheritance use the states (i personnaly put all the states in a single file but you can quite put them in separate files, it's necessary to inform them in index.html eg: <script src="src/otherfile.js"></script> This template is based on : https://github.com/EnclaveGames/Cyber-Orb and how to adjust the scale is based on: Now my template for the beginners , index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>example_test_scale</title> <link rel="shortcut icon" href="favicon.png" type="image/x-icon" /> <style> body { margin: auto; display: table; position: absolute; border:0px; top: 0px; left: 0px; padding: 0; margin: 0; background: #ffff00 } </style> <!--necessary for cocoon.js--> <script src="cordova.js"></script> <script src="src/phaser.js"></script> <script src="src/main.js"></script> </head> <body> </body> <script> document.addEventListener("deviceready", function() { setTimeout(function() { navigator.splashscreen.hide(); }, 5000, false); }); (function() { //start with a game with these resolution : 1280-1920 // personnaly i find it offers the best graphics for all devices but may slow some devices. // after put a safe zone //1280+200 > 1480 //1920 +350 > 2270 (350 is 200*1.5 > ratio from 1920/1280) var safe_zone_width=1480; var safe_zone_height=2270; var w = window.innerWidth ;//* pixelRatio, var h = window.innerHeight ;//* pixelRatio; var lw, lh; if ( h > w ) { lw = h; lh = w; } else { lw = w; lh = h; } var aspect_ratio_device = lw/lh; var aspect_ratio_safe_zone = safe_zone_height / safe_zone_width; var extra_height = 0, extra_width = 0; if (aspect_ratio_safe_zone < aspect_ratio_device) { // have to add game pixels horizontally in order to fill the device screen extra_height = aspect_ratio_device * safe_zone_width - safe_zone_height; } else { // have to add game pixels vertically extra_width = safe_zone_height / aspect_ratio_device - safe_zone_width; } game = new Phaser.Game( safe_zone_width + extra_width, safe_zone_height + extra_height, Phaser.CANVAS, 'game'); game.state.add('boot', boot); game.state.add('preloader', preloader); game.state.add('the_game', the_game); game.state.add('next_screen', next_screen); game.state.start('boot'); })(); </script> </html> my main.js //initialize variables here var test="1...2...3"; var text="hello from sprite"; //example of prototype => a simple sprite _sprite = function(game,posx,posy,picture){ this.picture=picture, this.posx=posx; this.posy=posy; //call the class sprite from Phaser Phaser.Sprite.call(this,game,this.posx,this.posy,this.picture); this.anchor.setTo(0.5,0.5); game.add.existing(this); }; _sprite.prototype=Object.create(Phaser.Sprite.prototype); // say hello from sprite _sprite.prototype.say_hello=function(){ alert(text); }; //use another prototype but with the previous parameter from _sprite, it's inheritance _super_sprite=function(game,posx,posy,picture,super_power){ //call the first prototype _sprite.call(this,game,posx,posy,picture); this.super_power=super_power; this.scale.setTo(2,2); }; _super_sprite.prototype=Object.create(_sprite.prototype); // add a new characteritic to this prototype _super_sprite.prototype.show_super_power=function(){ alert(this.super_power); }; var boot = { preload: function() { }, create: function() { //to scale the game this.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; this.game.scale.pageAlignHorizontally = true; this.game.scale.pageAlignVertically = true; //red color to see the background of the game itself // you must change the background in the index.html to have the same color in the background game // > change the yellow in red it's only to see how the game is scalling this.game.stage.backgroundColor = '#ff4000'; this.game.scale.refresh(); this.game.state.start('preloader'); }, }; var preloader = { preload: function() { this.load.image('green_circle', 'img/green_circle.png'); this.load.image('white_circle', 'img/white_circle.png'); }, create: function() { this.game.state.start('the_game'); //do not use arrow function like this var some_function=()=>{alert(test)} //it works on webview+ mode but not on canvas mode var some_function=function(){ alert(test); }; some_function(); } }; var the_game = { create: function(){ //to center an object in your game use this: this.green_circle = this.add.sprite(this.game.world.centerX,this.game.world.centerY,'green_circle'); this.green_circle.anchor.setTo(0.5,0.5); this.game.add.existing(this.green_circle); this.game.time.events.add(2000,function(){this.game.state.start('next_screen');},this); //use prototype => sprite with white_circle this.white_circle=new _sprite(game,this.game.world.centerX,1800,'white_circle'); this.game.time.events.add(1000,function(){this.white_circle.say_hello();},this); //use another prototype with inheritance this.super_white_circle=new _super_sprite(game,this.game.world.centerX,1500,'white_circle','i am superman'); this.game.time.events.add(1500,function(){this.super_white_circle.show_super_power();},this); this.game.time.events.add(1800,function(){this.super_white_circle.say_hello();},this); }, }; //for the next screen => next state, the green_circle move to top and alpha is minder var next_screen = { create: function(){ console.log("next"); this.green_circle = this.add.sprite(this.game.world.centerX,300,'green_circle'); this.green_circle.anchor.setTo(0.5,0.5); this.green_circle.alpha=0.5; this.game.add.existing(this.green_circle); }, }; And finally you could download all the template below(template.zip). To launch the app, go to template/www/index.html or upload the file template.zip in cocoon.io and run it. https://docs.cocoon.io/article/developer-app/ Enjoy ! ps liste of tools i use : image editor => https://www.gimp.org/fr/ vector image => https://inkscape.org/fr/ font to image => http://kvazars.com/littera/ convert music to ogg => https://audio.online-convert.com/fr/convertir-en-ogg reduce png => https://tinypng.com/ particle editor => https://phaser-particle-editor.firebaseapp.com/ text editor the best => https://neovim.io/doc/user/nvim.html plugin with nvim : Plug 'scrooloose/nerdtree' Plug 'morhetz/gruvbox' Plug 'Shougo/deoplete.nvim', { 'do': ':UpdateRemotePlugins' } Plug 'Raimondi/delimitMate' Plug 'rhysd/github-complete.vim' Plug 'easymotion/vim-easymotion' Plug 'terryma/vim-multiple-cursors' Plug 'vim-syntastic/syntastic' Plug 'kien/ctrlp.vim' Plug 'majutsushi/tagbar' Plug 'pangloss/vim-javascript' Plug 'vim-scripts/indenthtml.vim' Plug 'walm/jshint.vim' syntax style correct => http://jshint.com/ colorscheme => https://github.com/joshdick/onedark.vim os : awesome wm on linux with zsh an interesting link to review the basis from javascript in 5 minutes > https://learnxinyminutes.com/docs/javascript/ template.zip -
I do have a game project made in PIXIJS HTML5. Currently I'm using Cocoon.io Canvas+ View for rendering. However It does have some bugs in old devices using PIXI 4.3 WebGL with Cocoon.io Canvas+. Is there another HTML5 accelerated Canvas good for games like Cocoon.io one? Thanks
-
I developed an HTML5 app and i used cocoon.io as compiler and webview as renderer, when i launch the app from my phone XHR doesn't wotk, looking at console i have a message "404 not found", but url exist and if i launch app from a browser it wotks!!!! Is It possibile cocoon compiler disable Ajax request?
-
Miam Boom! is now available on iOS and Android. Find them here: Download from the App Store on your iPhone, iPad and iPod. Download from Google Play on your Android phone or tablet. You can also play online in your browser: www.miamboom.com Game Objective Slide your monster left and right to catch falling fruit but avoid the bombs and energy drinks. Try to get the highest score. Development Miam Boom was developed with my own framework Backbone Game Engine. It is my second game to be released to iOS and Android using cocoon.io (cordova). The game was designed with my 10-year old daughter. I learned a few things building this game. Notably supporting any device size. I wrote a post about it here. Other things I learned: - Sound does not work well in WebView+. Delays and some don't play. This is because the device requires a user action before playing the sound. This causes some sounds not to play and others to be delayed. Use Canvas+ instead. - Cordova provides tons of great plugins to gain access to the native device features. Notably native share and language detect. Really easy to use and powerful. Thanks to the community for providing feedback, especially @b10b (see previous post). --Martin
-
Hi there, so I have my game uploaded in the App Store (beta testing with testflight at the moment). I have uploaded like 8-9 compilations as I´m developing the game and everything worked fine (almost, uploading a game for iOS is always a pain in the ass) but since yesterday, everytime I try to upload a new compilation I´m receiving this error from Xcode: Unable to validate you application. The application you have selected does not exist. Well, if I go to the website I can see that my app exists, so something weird is hapenning here... probably with the bundle name or something like that, I don´t know. I guess it´s irrelevant, but I´m making the game with Phaser and compiling it with cocoon.io and then, uploading with Xcode, the normal way to do that... but Apple is Apple and I´m receiving that error. Anyway, what I did is to open de .xarchive with Xcode, export it and upload the .ipa with the Image Loader, everything went perfectly this way (uh oh, so my app exists, Apple...) But I wanted to know if someone is having the same problem or if someone knows why this is hapenning and how to fix it. Cheers.
-
Available at Google Play store:https://play.google.com/store/apps/details?id=net.rasteri.catventures Catventures is now available for Windows Phone:https://www.microsoft.com/en-us/store/apps/catventures/9nblggh5wr0d Available for iOS:https://itunes.apple.com/app/id1037704983 Here's beta gameplay demo in Youtube:https://www.youtube.com/watch?v=wvqVrbiHeD0 Game is done by using Construct 2 and build by cocoon.io. Follow me on Twitter @rasterigames
