Forums » Games » Portals in Impact

I made a WIP demo of getting portals into ImpactJS, you can play it here: https://dl.dropbox.com/u/52514/games/impact-portal/index.html

Feedback is welcome, but keep in mind that it's really rough, and definitely isn't final!

I wrote a blog post about it, that explains some more about my goals: http://kirbysayshi.github.com/2012/06/26/portal-experiments-impactjs.html

Next up is figuring out how to draw impact maps at an angle!

EDIT: 07/05/2012 (Copied from my post below)

I've made a new demo, located at: https://dl.dropbox.com/u/52514/games/impact-portal-2/index.html

It contains some slopes, which demonstrate how portals can be placed there perfectly. In order to make that work, I had to do some pretty interesting massaging from collision-map: http://impactjs.com/forums/help/entity-collision-with-sloped-tile-get-initial-point-of-collision/page/1#post18281

It uses dat-gui.js (http://code.google.com/p/dat-gui/) to implement a control panel that allows you to change physics ON THE FLY! This makes it pretty easy to tweak jump timings, accelerations, etc. I also implemented a basic jump boost, where if you hold down jump, you'll go higher.

I realize the portals aren't as "responsive" when it comes to teleporting you, but that's because I need to tweak them anyways (it's also easy to have one miss you when you're moving quickly).

Pretty cool! You can actually rotate the entire map fairly easily by transforming the context (http://www.html5canvastutorials.com/advanced/html5-canvas-transform-rotate-tutorial/) with ig.system.context.

Cool start!

I saw someone else trying to implement portals in impact, but I think you've done the best job of it. If you can get that rotation going it would look pretty neat, but it would probably make the game super confusing to play.

I agree about your views on aiming with the mouse, but I'm not sure your "dual stick" configuration is better. The good thing about using a mouse to aim is the immediacy of it, it's very simple to grasp, but it mostly boils down to preference I think. And a good thing about the w,a,s,d setup is that you limit where people can shoot their portals in a cool way (no diagonals), making for more interesting puzzles.

Good luck, and make some puzzling levels for us please :)

Very cool! The spotlights are a nice touch. I look forward to seeing more.

Quote from Graphikos
Pretty cool! You can actually rotate the entire map fairly easily by transforming the context (http://www.html5canvastutorials.com/advanced/html5-canvas-transform-rotate-tutorial/) with ig.system.context.

Thanks for the advice! Unfortunately, that leaves a nasty artifact, since Impact would draw the backgrounds, then I would rotate, but it would have only drawn a rectangle the size of the canvas, so you'd see the corners. But I am working on something like drawing the map twice, once to the system canvas, and another to an internal buffer where I could change the size of the viewport to account for the rotation. I've got some code over here, http://impactjs.com/forums/help/drawing-an-arbitrary-part-of-the-map-double-buffering, help is appreciated!

Quote from Krisjet

I agree about your views on aiming with the mouse, but I'm not sure your "dual stick" configuration is better. The good thing about using a mouse to aim is the immediacy of it, it's very simple to grasp, but it mostly boils down to preference I think. And a good thing about the w,a,s,d setup is that you limit where people can shoot their portals in a cool way (no diagonals), making for more interesting puzzles.

Hopefully I get to add diagonals next! I feel like a big part of what makes Portal fun is flying through the air, which is hard to do without diagonals. Thanks for the input regarding the mouse though! I still haven't figured out the best way to place blue vs. orange portals, if only using WASD...

Quote from quidmonkey
Very cool! The spotlights are a nice touch. I look forward to seeing more.

I was able to implement being able to see through the portals to the other side in a primitive manner, so the spotlights are gone for now. They were mostly for calculating what that portal was "seeing"... but they're easy enough to add back if you'd prefer them, let me know what you think!

First up, I'm very impressed, it looks awesome!

If you're going to stick with the keyboard for aiming, you could always use shift/not-pressing-shift to indicate blue or orange portal, and I think that could be interesting not to have totally-free-format placement (so that using up/down/left/right is the only way to place), it certainly would make puzzle planning interesting...

I'm thinking you could make puzzles where 'if I could place it anywhere, I could easily solve it', but the lack of being able to shoot just anywhere means players have to think outside the box.

Wow! Very impressive. Any chance you'll come out with an article or a post about how you did this? I imagine you've had to twist Impact quite a bit to implement those cone-views?

This is just mind blowing! Well done.

Quote from Xaan
Wow! Very impressive. Any chance you'll come out with an article or a post about how you did this? I imagine you've had to twist Impact quite a bit to implement those cone-views?

Yes, actually. I'm still in the process of making it viable, because while it's working, there is significant time spent drawing the maps effectively 3 times per update (once for the screen, one for portal a, one for portal b).

Quote from fulvio
This is just mind blowing! Well done.

Thanks!

I've made a new demo, located at: https://dl.dropbox.com/u/52514/games/impact-portal-2/index.html

It contains some slopes, which demonstrate how portals can be placed there perfectly. In order to make that work, I had to do some pretty interesting massaging from collision-map: http://impactjs.com/forums/help/entity-collision-with-sloped-tile-get-initial-point-of-collision/page/1#post18281

It uses dat-gui.js (http://code.google.com/p/dat-gui/) to implement a control panel that allows you to change physics ON THE FLY! This makes it pretty easy to tweak jump timings, accelerations, etc. I also implemented a basic jump boost, where if you hold down jump, you'll go higher.

I realize the portals aren't as "responsive" when it comes to teleporting you, but that's because I need to tweak them anyways (it's also easy to have one miss you when you're moving quickly).

Real quik: I'm making a portal2 (D) game and am using your (awsome) portals. But where are you requiring 'glMatrix.js'? Please awnser soon.

the demo in the first post got a little glitchy on me for a bit, but I think that was my horrible job of creating portals... lol but I like it!