Search the Community

Showing results for tags 'orientation'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 14 results

  1. Problems in Landscape mode

    Hi everyone!, I've just started to use Phaser's framework, so I don't have enought knowledge about it. I did a game (test it here), it works well on pc's browser. The problem were when I tried to do it mobile friendly. I tried to do that (on boot's state): if (!game.device.desktop) { game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.scale.refresh(); } When I test it in my phone (portrait mode) it works good . The problem is when I rotate the screen (landscape mode), it doesn't scale well(I can't see the bottom). Portrait view: Landscape view: (I can't see the bottom) What is the problem ?? Thanks!!
  2. Mobile orientation stretch problem

    Hey guys, I reference below thread to scale my game to fit window. it works on desktop. But i run on mobile and open in wrong orientation, the game will be stretched. I have set scale mode showall, the game screen should keep aspect ,right? I don't have idea why the game will be stretch even i set in noscale. I know the post http://www.emanueleferonato.com/2015/04/23/how-to-lock-orientation-in-your-html5-responsive-game-using-phaser/ you can hint user to rotate the mobile phone. If i don't want to hint user to rotate mobile and just want to scale game to fit window and no stretch. Is there any good idea to solve this question? Thank you so much!
  3. Responding to Orientation Changes

    Hi, I am creating my first game for the web (I created for android with CocoonJS) and I find the problem of the orientation of the device, my game is in landscape mode, and I watched that "there can be locked to a single perspective "you should listen and react to the event, but really do not know how to implement it, and try cSS, someone has a method that works (please, no phaser) only JS.
  4. Hello guys, im trying to join two meshes (spheres) with a cylinder.( maybe basic but i'm having hard times as a beginner). The problem is that the default cylinder constructor leaves you with just the ability to only set the size , diameter of both top and bottom, and tessellation · Mesh.CreateCylinder(name, height, diameterTop, diameterBottom, tessellation, scene, updatable) ​when i need to do something like · New Cylinder(vectorStart, vectorEnd, scene) ​ i've tried something like: Cylinder = function(vstart,vend, scene){ var HALF_PI = Math.PI/2 ; var distance = BABYLON.Vector3.Distance(vstart, vend); var position = vend.clone().add(vstart).divide(new BABYLON.Vector3(2,2,2)); var material = new BABYLON.StandardMaterial("kosh", scene); var cylinder = BABYLON.Mesh.CreateCylinder("cylinder", distance, 1, 1, 36, scene, true); var orientation = new BABYLON.Matrix(); var offsetRotation = new BABYLON.Matrix(); orientation = BABYLON.Matrix.LookAtLH(vstart, vend, new BABYLON.Vector3(0,1,0)); offsetRotation =BABYLON.Matrix.RotationX(HALF_PI); orientation.multiply(offsetRotation); cylinder.bakeTransformIntoVertices(orientation);; cylinder.position = position;; } but it doesn't seem to work . maybe i'm having a really bad approach of the problem but actually i really don't know what to do . Can someone have any idea for me ? help will be so appreciated thanks in advance ! .
  5. Hi! In my scene I have multiple instanced robots with single skeleton. When two of them get near enough each they should start shooting lasers. Skeleton has a bone named "Arm.Gun L", its position and orientation already define the origin from where the laser is shot and its direction vector, the problem is that I can't find a way how to access the data. It need to be accessed and copied only once. Find the bone: this._bone = skeletons[0].bones.filter((b: BABYLON.Bone) => { return b.name === "Arm.Gun L";})[0];And when firing: var l = this._laser.createInstance("l");l.position = ? // this._bone.?l.rotation = ? // this._bone.?After looking through the docs for Bone and InstancedMesh (together with its base classes Mesh and Node) the only useful thing I found are local and globalMatrix methods on bones (if I could apply localMatrix to laser would probably do what I want with some minor fixes), but haven't found any efficient way of applying to a laser.
  6. Hi everyone!! I´ve developed a game based on "Spring Ninja" and I made it responsive: https://spritted.com/es/play/jump-bot As you can see the game auto-adapts to all screens taking all the available space on the window. It does the same in all platforms. I use the innerWidth and innerHeight to load a different size depending on the screen ratio: var innerWidth = window.innerWidth;var innerHeight = window.innerHeight;var gameRatio = innerWidth/innerHeight;if(innerWidth > innerHeight){ game = new Phaser.Game(Math.ceil(320*gameRatio), 320, Phaser.AUTO); } But I have a problem for mobile: when I load the game on "Portrait" and then the user changes the orientation I would like to reorder the Canvas to autoadapt to the new screen ratio. But I´m can´t do it. I wrote this code: $(window).resize(function() { resizeGame(); } );function resizeGame() { var innerWidth = window.innerWidth;var innerHeight = window.innerHeight;var gameRatio = innerWidth/innerHeight; game.width = Math.ceil(320*gameRatio); game.height = 320; game.stage.bounds.width = Math.ceil(320*gameRatio); game.stage.bounds.height = 320;game.scale.refresh(); } This code is supposed to set the new dimensions to the game, but instead of reescaling everything properly every object gets deformed: Is it possible to render again the game with the new size?
  7. Hi, I am developing an app, where I would like to see the orientation of the screen kept to Portrait. After many searches on google, I gave up and just went ahead with building a simple prototype of my app idea. I have now come to a stage where I should deal with the orientation aspect of the app. After studying the book: Phaser Scale manager for Phaser 2.2.2, I have tried to use the following code in my app: if (game.device.desktop === false) { game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.scale.forceOrientation(true, false); game.scale.enterIncorrectOrientation.add(this.enterIncorrectOrientation, this); game.scale.leaveIncorrectOrientation.add(this.leaveIncorrectOrientation, this); }I am new to Phaser and programming generally. I earned a distinction in the Coursera: Intro to computer programming in Python.I have found that what I have learn't in that course is easily transferable to JavaScript and Phaser, yet, I am still learning. Maybe if this problem can be resolved, it would help other people new to Phaser on the forums also. Codenburger
  8. Hey! After upgrading from a previous version (2.0.something) to 2.2.2 I noticed that my orientation handling code (lifted directly from the Full Screen Mobile template) no longer works. This is my Boot.js: BasicGame = { /* Your game can check BasicGame.orientated in internal loops to know if it should pause or not */ orientated: false};BasicGame.Boot = function (game) {};BasicGame.Boot.prototype = { create: function () { this.input.maxPointers = 1; this.stage.disableVisibilityChange = true; this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; // this.scale.minWidth = 480; // this.scale.minHeight = 260; // this.scale.maxWidth = 1024; // this.scale.maxHeight = 768; // this.scale.pageAlignHorizontally = true; // this.scale.pageAlignVertically = true; this.scale.forceOrientation(true, false); //this.scale.hasResized.add(this.gameResized, this); this.scale.enterIncorrectOrientation.add(this.enterIncorrectOrientation, this); this.scale.leaveIncorrectOrientation.add(this.leaveIncorrectOrientation, this); // this.scale.setScreenSize(true); this.state.start('Preloader'); }, enterIncorrectOrientation: function () { BasicGame.orientated = false; document.getElementById('orientation').style.display = 'block'; }, leaveIncorrectOrientation: function () { BasicGame.orientated = true; document.getElementById('orientation').style.display = 'none'; }};With 2.0.x phaser.js lib, the above code displays my "please rotate device" image when the orientation changes to portrait. After swapping for 2.2.2 phaser.js, it doesn't work. The functions "enterIncorrectOrientation" and "leaveIncorrectOrientation" never actually run (I tested it with console.log), so I guess either the Signals are not added or Phaser doesn't detect orientation anymore. API change? What should I try instead? I guess I could use .setResizeCallback instead, then add a test for example if window.innerWidth < window.innerHeight then display the orientation image, so there's that. But I'd prefer to use a built-in Phaser's method if possible.
  9. Help managing sprite orientation

    I am using some art of a player character for a top down game I am making - the art is here: http://opengameart.org/content/top-down-mage-animations The sprite is orientated so that the mage's face / front is facing upward (north). I'm having some issue with rotation, with both mouse movement and keyboard movement. For example, I have this "hack" that adds additional radians to a calculated angle in order to get the mage's "front" to face the pointer instead of the right shoulder: this.rotation = this.game.physics.arcade.angleToPointer(this, pointer) + 1.57079633; Is there an easier way to handle this? I'm running in to the same issue attempting to use angular velocity for keyboard movements: this.game.physics.arcade.velocityFromAngle(this.angle, 300, this.body.velocity); The goal is to get wasd to rotate and move the character similar to the example here: http://examples.phaser.io/_site/view_full.html?d=arcade%20physics&f=angular+velocity.js&t=angular%20velocity) What is the best way to get the front of the sprite to face the direction the sprite is moving? I will also be having objects that "shoot" out from the front of the sprite, which will have to be based on it's rotation so I'd rather calculate the offset a single time instead of all over the place... Let me know if this makes sense. Thank you!
  10. the innerWidth and innerHeight of an iphone 4 is 320 x 480. if the iphone was turned sideways, will the innerWidth and innerHeight reverse?
  11. What I expect from forceOrientation(false, true, 'orientation') is nice orientation image in landscape. What I got is slightly different. Vertically distorted in chrome and scaled down image everywhere else. Is there any way to get around this?
  12. Do you guys have any plans on text formatting functionality? Being able to have different text styles in one Pixi text object. For example: This is a bold string and an italic string as well as the strikethrough within a single Pixi text object. Also, do you guys plan on adding different orientation support (like vertically oriented text for oriental characters)? Thanks for the great work you guys are doing.
  13. Hi! From what I could observe, html5 mobiles games are usually made in a 320x480 resolution and in portrait. This is a general rule for sponsorship? if I run a bit to this rule, I will have less chances? Otherwise, what are the limits? and games in portrait instead of landscape are preferable? Thanks for listening.
  14. In a scenario where you have a mobile game designed for landscape but the user is holding the phone in portrait (or vice versa), i'd be interested in opinions on whether it's preferable to... A) pause/hide the game and display a message requesting user rotate device to correct orientation resize + reposition game regardless of orientation (allowing game to appear pretty tiny in the wrong orientation) C) something else (rotate all game assets 90 degrees to fake an orientation lock?)