Search the Community

Hello , I'm super new to Typescript , html5 , and I'm looking for some direction, so I started my first "hello world" game and I would like to know how to host it(web host). I have windows hosting through Arvixe... not sure what is required I'm using visual studio 2015 and typescript Thank you in advance Jimmy

Hello, Everybody! I'm currently planning to create a browser game using the Babylon.js framework. I am confused about deployment and how to actually release the game, so I would appreciate if you would solve a couple of mysteries I have about this. First of all, I can see that I need a webserver in order to use Babylon properly. I understand that this is because I need to define a custom MIME type for the .babylon extension to be loadable. Alright, so basically, all I need to do is use the js framework to craft my own game by implementing game mechanics and importing files from Blender with the .babylon extension, all of this running on my Apache local webserver? If so, then how can I redistribute the game? I will make users download the games files (js scripts, .babylon files, css files and actual html files that link everything) but how can I be sure that the user will actually have a webserver installed? What if they don't? Because my point is to make the game work offline, not in such a way that the users will need to access my website everytime they want to play the game. And then I thought about Node.js. Do you guys think I can include node.js along with the game files? I mean, will that create a node local server on every user's machine when they download the files, so the game will be ran on that node.js server just as it runs on my own local server on my machine? How can I do that? Is this what I'm supposed to do? Or, perhaps, this is totally wrong and I should simply host the game files on my online server and only allow users to play online? Thank you!

Hello, I have some projects in Phaser working on web. I wanted to try PhoneGap (need some of plugins). I've started from converting some simple project to app (without any additional plugins yet) and I run into problems. APK is builded without any errors on PhoneGap Cloud Builder, but apk after install doesn't show any of Phaser content. I'm installing app from .apk file, not from Google Play/Market or whatever it is currently called - in short not from store. I have PhoneGap HelloWorld example working. It consists of: empty .cordova directory empty hooks directory empty platforms directory empty plugins directory www directory described later config.xml I didn't change anything in config.xml, but here it is : <widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" id="pl.myapp.sample" version="1.0.0"> <name>appSample</name> <description>Hello World sample application that responds to the deviceready event.</description> <author href="http://phonegap.com" email="[email protected]">PhoneGap Team</author> <content src="index.html"/> <preference name="DisallowOverscroll" value="true"/> <preference name="android-minSdkVersion" value="14"/> <plugin name="cordova-plugin-battery-status" source="npm"/> <plugin name="cordova-plugin-camera" source="npm"/> <plugin name="cordova-plugin-media-capture" source="npm"/> <plugin name="cordova-plugin-console" source="npm"/> <plugin name="cordova-plugin-contacts" source="npm"/> <plugin name="cordova-plugin-device" source="npm"/> <plugin name="cordova-plugin-device-motion" source="npm"/> <plugin name="cordova-plugin-device-orientation" source="npm"/> <plugin name="cordova-plugin-dialogs" source="npm"/> <plugin name="cordova-plugin-file" source="npm"/> <plugin name="cordova-plugin-file-transfer" source="npm"/> <plugin name="cordova-plugin-geolocation" source="npm"/> <plugin name="cordova-plugin-globalization" source="npm"/> <plugin name="cordova-plugin-inappbrowser" source="npm"/> <plugin name="cordova-plugin-media" source="npm"/> <plugin name="cordova-plugin-network-information" source="npm"/> <plugin name="cordova-plugin-splashscreen" source="npm"/> <plugin name="cordova-plugin-statusbar" source="npm"/> <plugin name="cordova-plugin-vibration" source="npm"/> <plugin name="cordova-plugin-whitelist" source="npm"/> <icon src="icon.png"/> <platform name="android"> <icon src="www/res/icon/android/drawable-ldpi-icon.png" density="ldpi"/> <icon src="www/res/icon/android/drawable-mdpi-icon.png" density="mdpi"/> <icon src="www/res/icon/android/drawable-hdpi-icon.png" density="hdpi"/> <icon src="www/res/icon/android/drawable-xhdpi-icon.png" density="xhdpi"/> <icon src="www/res/icon/android/drawable-xxhdpi-icon.png" density="xxhdpi"/> <icon src="www/res/icon/android/drawable-xxxhdpi-icon.png" density="xxxhdpi"/> <splash src="www/res/screen/android/drawable-land-ldpi-screen.png" density="land-ldpi"/> <splash src="www/res/screen/android/drawable-land-mdpi-screen.png" density="land-mdpi"/> <splash src="www/res/screen/android/drawable-land-hdpi-screen.png" density="land-hdpi"/> <splash src="www/res/screen/android/drawable-land-xhdpi-screen.png" density="land-xhdpi"/> <splash src="www/res/screen/android/drawable-land-xxhdpi-screen.png" density="land-xxhdpi"/> <splash src="www/res/screen/android/drawable-land-xxxhdpi-screen.png" density="land-xxxhdpi"/> <splash src="www/res/screen/android/drawable-port-ldpi-screen.png" density="port-ldpi"/> <splash src="www/res/screen/android/drawable-port-mdpi-screen.png" density="port-mdpi"/> <splash src="www/res/screen/android/drawable-port-hdpi-screen.png" density="port-hdpi"/> <splash src="www/res/screen/android/drawable-port-xhdpi-screen.png" density="port-xhdpi"/> <splash src="www/res/screen/android/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/> <splash src="www/res/screen/android/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/> </platform> <platform name="ios"> <icon src="www/res/icon/ios/icon.png" platform="ios" width="57" height="57"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="114" height="114"/> <icon src="www/res/icon/ios/icon-40.png" platform="ios" width="40" height="40"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="80" height="80"/> <icon src="www/res/icon/ios/icon-50.png" platform="ios" width="50" height="50"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="100" height="100"/> <icon src="www/res/icon/ios/icon-60.png" platform="ios" width="60" height="60"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="120" height="120"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="180" height="180"/> <icon src="www/res/icon/ios/icon-72.png" platform="ios" width="72" height="72"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="144" height="144"/> <icon src="www/res/icon/ios/icon-76.png" platform="ios" width="76" height="76"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="152" height="152"/> <icon src="www/res/icon/ios/icon-small.png" platform="ios" width="29" height="29"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="58" height="58"/> <icon src="www/res/icon/ios/[email protected]" platform="ios" width="87" height="87"/> <splash src="www/res/screen/ios/Default-568h@2x~iphone.png" platform="ios" width="640" height="1136"/> <splash src="www/res/screen/ios/Default-667h.png" platform="ios" width="750" height="1334"/> <splash src="www/res/screen/ios/Default-736h.png" platform="ios" width="1242" height="2208"/> <splash src="www/res/screen/ios/Default-Landscape-736h.png" platform="ios" width="2208" height="1242"/> <splash src="www/res/screen/ios/Default-Landscape@2x~ipad.png" platform="ios" width="2048" height="1536"/> <splash src="www/res/screen/ios/Default-Landscape~ipad.png" platform="ios" width="1024" height="768"/> <splash src="www/res/screen/ios/Default-Portrait@2x~ipad.png" platform="ios" width="1536" height="2048"/> <splash src="www/res/screen/ios/Default-Portrait~ipad.png" platform="ios" width="768" height="1024"/> <splash src="www/res/screen/ios/Default@2x~iphone.png" platform="ios" width="640" height="960"/> <splash src="www/res/screen/ios/Default~iphone.png" platform="ios" width="320" height="480"/> </platform> <platform name="wp8"> <icon src="www/res/icon/wp8/ApplicationIcon.png" platform="wp8" width="99" height="99"/> <icon src="www/res/icon/wp8/Background.png" platform="wp8" width="159" height="159"/> <splash src="www/res/screen/wp8/screen-portrait.jpg" platform="wp8" width="768" height="1280"/> </platform> <platform name="windows"> <icon src="www/res/icon/windows/Square150x150Logo.scale-100.png" platform="windows" width="150" height="150"/> <icon src="www/res/icon/windows/Square30x30Logo.scale-100.png" platform="windows" width="30" height="30"/> <icon src="www/res/icon/windows/StoreLogo.scale-100.png" platform="windows" width="50" height="50"/> <splash src="www/res/screen/windows/SplashScreen.scale-100.png" platform="windows" width="620" height="300"/> <icon src="www/res/icon/windows/StoreLogo.scale-240.png" platform="windows" width="120" height="120"/> <icon src="www/res/icon/windows/Square44x44Logo.scale-100.png" platform="windows" width="44" height="44"/> <icon src="www/res/icon/windows/Square44x44Logo.scale-240.png" platform="windows" width="106" height="106"/> <icon src="www/res/icon/windows/Square70x70Logo.scale-100.png" platform="windows" width="70" height="70"/> <icon src="www/res/icon/windows/Square71x71Logo.scale-100.png" platform="windows" width="71" height="71"/> <icon src="www/res/icon/windows/Square71x71Logo.scale-240.png" platform="windows" width="170" height="170"/> <icon src="www/res/icon/windows/Square150x150Logo.scale-240.png" platform="windows" width="360" height="360"/> <icon src="www/res/icon/windows/Square310x310Logo.scale-100.png" platform="windows" width="310" height="310"/> <icon src="www/res/icon/windows/Wide310x150Logo.scale-100.png" platform="windows" width="310" height="150"/> <icon src="www/res/icon/windows/Wide310x150Logo.scale-240.png" platform="windows" width="744" height="360"/> <splash src="www/res/screen/windows/SplashScreenPhone.scale-240.png" platform="windows" width="1152" height="1920"/> </platform> <access origin="*"/> <allow-intent href="http://*/*"/> <allow-intent href="https://*/*"/> <allow-intent href="tel:*"/> <allow-intent href="sms:*"/> <allow-intent href="mailto:*"/> <allow-intent href="geo:*"/> <platform name="android"> <allow-intent href="market:*"/> </platform> <platform name="ios"> <allow-intent href="itms:*"/> <allow-intent href="itms-apps:*"/> </platform> </widget> In www directory I have: index.html spec.html (default from PhoneGap) config.xml copied from previous directory phaser.min.js and phaser.map some assets from my project (.xml, .json, .jpg) directories for: css, img, js, res, spec index.html: <!DOCTYPE html> <!-- Copyright (c) 2012-2016 Adobe Systems Incorporated. All rights reserved. Licensed to the Apache Software Foundation (ASF) under one or more contributor license agreements. See the NOTICE file distributed with this work for additional information regarding copyright ownership. The ASF licenses this file to you under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. --> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="msapplication-tap-highlight" content="no" /> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" /> <!-- This is a wide open CSP declaration. To lock this down for production, see below. --> <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" /> <!-- Good default declaration: * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this: * Enable inline JS: add 'unsafe-inline' to default-src * Enable eval(): add 'unsafe-eval' to default-src * Create your own at http://cspisawesome.com --> <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *" /> --> <link rel="stylesheet" type="text/css" href="css/index.css" /> <style type="text/css"> body{ background: #ffffff; padding:0px; margin:0px; } </style> <title>Hello World</title> </head> <body> <div class="app"> <h1>Hello PhoneGap N00B</h1> <div id="deviceready" class="blink"> <p class="event listening">Connecting to Device</p> <p class="event received">Device is Ready</p> </div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> <script src="phaser.min.js"></script> <script src = "js/preload.js"></script> <script src = "js/intro.js"></script> <script type="text/javascript"> app.initialize(); var game = new Phaser.Game(1920, 1080); game.state.add('Preload', MyGame.preload) game.state.add('Intro', MyGame.intro); game.state.start('Preload'); </script> </body> </html> In js directory I have: index.js (default from PhoneGap example) intro.js (my project state) preload.js (my project state) index.js: /* * Licensed to the Apache Software Foundation (ASF) under one * or more contributor license agreements. See the NOTICE file * distributed with this work for additional information * regarding copyright ownership. The ASF licenses this file * to you under the Apache License, Version 2.0 (the * "License"); you may not use this file except in compliance * with the License. You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ var app = { // Application Constructor initialize: function() { this.bindEvents(); }, // Bind Event Listeners // // Bind any events that are required on startup. Common events are: // 'load', 'deviceready', 'offline', and 'online'. bindEvents: function() { document.addEventListener('deviceready', this.onDeviceReady, false); }, // deviceready Event Handler // // The scope of 'this' is the event. In order to call the 'receivedEvent' // function, we must explicitly call 'app.receivedEvent(...);' onDeviceReady: function() { app.receivedEvent('deviceready'); }, // Update DOM on a Received Event receivedEvent: function(id) { var parentElement = document.getElementById(id); var listeningElement = parentElement.querySelector('.listening'); var receivedElement = parentElement.querySelector('.received'); listeningElement.setAttribute('style', 'display:none;'); receivedElement.setAttribute('style', 'display:block;'); //console.log('Received Event: ' + id); } }; What I get after installing my app is just HelloWorld, no states are loading. When I emulate that project using PhoneGap launcher App it looks the same, but when I connect on same ip (generated through PhoneGap Desktop app) using web then states are loaded properly. I've uploaded my files in a .zip to PhoneGap Cloud in order to build. Everything from www directory was added to .zip file and sent - there were no compiling errors (I didn't attach any key, but I don't want to upload it to store yet, just custom install from .apk). Any help appreciated. EDIT: differencies that I see in web and emulation on android device : -web is displaying my states correctly, but on PhoneGap part, where it is trying to connect to the device it is stuck (all the time there is displayed "Connecting to device") -while on mobile emulation it is correctly connecting to device, but nothing from my project is displayed If you know about some working tutorials that I can follow to export Phaser app with states to PhoneGap - they are welcome.

Recently i develop a game based on http://www.pandajs.net/ . But when i upload this game in a server with the "media" and "src" folder, it gives "Internal Server Error" . Is their any procedure to upload my game into server ? Sincerely Akashs