Three.js Move camera or two different cameras - camera

I have a scene of say a coloured cube with the red side facing the camera and blue side on the far side. I want to click the "End" key and have the camera now facing the blue side (move the camera not the cube). Also have the option to hit the "Home" key to reverse the above, so it then moves back to the red side.
First thing what is the best 1 camera or 2.
Second thing I am having problems getting my keys recognised with the following code.
function animate()
{
requestAnimationFrame(animate);
render();
update();
}
function update()
{
if ( keyboard.pressed("1") )
{ currentCamera = 1; }
if ( keyboard.pressed("2") )
{ currentCamera=2; }
}
function render()
{
if(currentCamera==1) renderer.render( scene, camera1 );
if(currentCamera==2) renderer.render( scene, camera2 );
}

i dont know what the exact problem is with the cameras. but the keys problem is solvable. keys are handled through the use of event listeners. for example:
window.addEventListener('keydown', function(event){
var key = event.keyCode;
switch(key){
case 49: currentCamera = 1; break;
case 50: currentCamera = 2; break;
}
});
keep in mind the keyCode is not the letter or number printed on the key but rather the ascii code.

Related

Microbit music / scroll output corrupting memory?

My son and I are trying to implement one of the fun-science.org microbit tutorials - building a "tug of war" game. Essentially, 10 presses on button A moves the sprite closer to that button and the same applies on button B. When you hit the edge of the screen, music plays and a message is scrolled on the screen before the game restarts.
We've got it fully working, but once the game has been won, it doesn't seem to reset properly. It works fine on the simulator, but not on the physical device (a microbit 2).
Once the game is won, the behaviour is erratic. It usually puts the sprite back in the middle, sometimes not, but frequently, one button doesn't work in the next game. Occasionally both stop working. In every situation, a restart fixes things.
Is there something wrong with the code? I've wondered whether the music / message is corrupting something and I need to put a wait in for it to complete. I've re-downloaded the hex file and re-flashed the microbit several times, so I think I've eliminated a corrupt code file.
Javascript version of code shown below, but it was actually built in blockly using the Microsoft MakeCode tool.
input.onButtonPressed(Button.A, function () {
sprite.change(LedSpriteProperty.X, -0.1)
})
input.onButtonPressed(Button.B, function () {
sprite.change(LedSpriteProperty.X, 0.1)
})
let sprite: game.LedSprite = null
sprite = game.createSprite(2, 3)
basic.forever(function () {
if (sprite.get(LedSpriteProperty.X) == 0) {
music.startMelody(music.builtInMelody(Melodies.Birthday), MelodyOptions.Once)
basic.showString("liverpool wins")
sprite.set(LedSpriteProperty.X, 2)
} else if (sprite.get(LedSpriteProperty.X) == 4) {
music.startMelody(music.builtInMelody(Melodies.Entertainer), MelodyOptions.Once)
basic.showString("rb leipzig wins")
sprite.set(LedSpriteProperty.X, 2)
}
})
I found it was more reliable if I did game.pause() and game.resume() while scrolling the text and playing the music at the end of the game:
input.onButtonPressed(Button.A, function () {
sprite.change(LedSpriteProperty.X, -0.1)
})
input.onButtonPressed(Button.B, function () {
sprite.change(LedSpriteProperty.X, 0.1)
})
let sprite: game.LedSprite = null
sprite = game.createSprite(2, 3)
basic.forever(function () {
if (sprite.get(LedSpriteProperty.X) == 0) {
game.pause()
music.startMelody(music.builtInMelody(Melodies.Birthday), MelodyOptions.Once)
basic.showString("liverpool wins")
game.resume()
sprite.set(LedSpriteProperty.X, 2)
} else if (sprite.get(LedSpriteProperty.X) == 4) {
game.pause()
music.startMelody(music.builtInMelody(Melodies.Entertainer), MelodyOptions.Once)
basic.showString("rb leipzig wins")
game.resume()
sprite.set(LedSpriteProperty.X, 2)
}
})
You can also take a look at the following version of the game that does not use the game rendering engine https://makecode.microbit.org/projects/tug-of-led to see if that makes a difference.

Titanium geolocation distanceFilter property is not working as expected

Need a help here for geolocation API - even after using Titanium.Geolocation.distanceFilter = 10; 10 in meter callback function is getting triggered randomly without moving here and there. Any idea what is wrong here ?
function Geolocate() {
var self = this;
// The callback function we should call when location is finally determined
this.locationReceivedCallback = function () {};
// Check if location event is already triggered or not
this.isLocationEventRegister = false;
// The function that unregisters the location event
this.unregisterLocationEvent = function () {
this.isLocationEventRegister = false;
Ti.Geolocation.removeEventListener('location', self.locationReceivedCallback);
};
}
Geolocate.prototype.init = function () {
// Setting up some preference values
Titanium.Geolocation.distanceFilter = 10; //The minimum change of position (in meters) before a 'location' event is fired.
if (deviceDetect.isIos()) {
Titanium.Geolocation.accuracy = Titanium.Geolocation.ACCURACY_BEST; // Using this value on Android enables legacy mode operation, which is not recommended.
} else {
Titanium.Geolocation.accuracy = Titanium.Geolocation.ACCURACY_LOW; //Using this value on Android enables simple mode operation.
}
};
Geolocate.prototype.getCurrentPosition = function (callback) {
this.isLocationEventRegister = true;
this.locationReceivedCallback = callback;
Titanium.Geolocation.addEventListener("location", this.locationReceivedCallback);
};
Geolocate.prototype.locationServicesAreAvailable = function () {
if (Titanium.Geolocation.locationServicesEnabled) {
return true;
} else {
return false;
}
};
Geolocate.prototype.cancelLocationRequest = function () {
this.unregisterLocationEvent();
};
module.exports = Geolocate;
Actual scenario is whenever I clicked on get location its gives me current location. then i tried to drag it map or image view for nearest place. Suddenly my view go current location. This is happening because of call back ? How to get rid off this ?
It's not a problem to do with your code, it is simply GPS in-accuracy.
GPS accuracy is (almost) never better than 10 meters, meaning it can be 10 meters off. When it recalculates your position it can be 10 meters down the line, so even if you're perfectly still with perfect GPS accuracy, you still might have differences of about 10 meters.
That said, you probably don't have best GPS accuracy when sitting behind a computer in a building, you probably have closer to 30-45 meters accuracy. Meaning every recalculation can easily be 10 meters differently.
Your solution would actually be rate-limit on top of using this property. The property will make sure it will not trigger multiple times per second, and then you can, in your own code, rate limit what you do with it.

How to set upper and lower bounds of panZoom widget in Cytoscape?

I can initialize the object just fine:
ngOnInit() {
this.cy = cytoscapeService.cytoscape( Object.assign( {
container : this.el.nativeElement,
}, DATA_FLOW_CYTOSCAPE_CONFIG ) );
this.cy.panzoom( Object.assign(
{ minZoom : 0, maxZoom : 10 }, // arbitrary numbers
relateConfig.panzoomDefaults,
) );
However, no matter what numbers I use, or as my graph changes views, I can't seem to update the max/min appearance of the zoom slider. What I mean is, if the view can only be zoomed from, let's say, 1-2, the entire slider should slide between the min (1) and the max (2).
private runLayout() {
this.cy.minZoom( 1e-50 );
const layout = this.cy.layout( DATA_FLOW_LAYOUT_CONFIG );
layout.on( 'layoutstop', () => {
this.cy.minZoom( this.cy.zoom() );
this.cy.panzoom( 'destroy' );
this.cy.panzoom( Object.assign(
{ minZoom : this.cy.zoom() },
relateConfig.panzoomDefaults,
) );
} );
This adjusts the zoom limits, but also just restricts the amount of movement the slider has, it doesn't recalculate the min and max slider positions.
Does this make sense? Any thoughts?
Ex:
Initial slider movement range -
[|----------[]----------|]
View changed, bounds limited -
[--|--[]---|-------------]
The problem here is with Object.assign.
this.cy.panzoom( Object.assign(
{ minZoom : this.cy.zoom() },
relateConfig.panzoomDefaults,
) );
If you keep the defaults for panZoom stored somewhere (relateConfig.panzoomDefaults in my case), they won't get overwritten with Object.assign. Removing the values I wanted to be able to change immediately allowed me to change them as needed using Object.assign.

How to improve PanResponder efficiency in ReactNative?

I am using React Native for a game (perhaps not the best framework but not the point). I need user to be able to slide on a grid. On the pic, user is selecting MKEC without removing its finger from screen.
I am from the web, so I thought I would use onHover event. But it dossn't exist on mobile. So I created a parent component and a grid component. Parent component catch event with PanResponder, and I calculate where user finger is on the grid, and change state of the grid component.
However, if user is going too fast from on letter to another, it sometimes 'skip' a letter. If you go from M to G (first column) very fast, it seems that not event is triggered on H. Am I clear ? User feels latency.
componentWillMount() {
const onRelease = (evt, gestureState) => {
this.props.validateWord();
};
const onMove = (evt, gestureState: GestureState) => {
const obj = Object.assign({}, {
pageX: evt.nativeEvent.pageX,
pageY: evt.nativeEvent.pageY
});
const pos = {
x: evt.nativeEvent.pageX - this.position.pageX,
y: evt.nativeEvent.pageY - this.position.pageY
}
const whatSquare = whatSquareIsTouched(
pos,
defaultLetter.width, // size of letter
defaultLetter.width * 0.22 // padding for diagonale
);
const letter = this.props.gridReducer[whatSquare.y]
&& this.props.gridReducer[whatSquare.y][whatSquare.x] ?
this.props.gridReducer[whatSquare.y][whatSquare.x] : null;
// if letter => if touch is on a letter and not outside of grid comp
if (letter) {
this.props.letterTouched(letter, whatSquare.insidePadding);
}
}
this._panResponder = createResponder(onMove, onRelease);
}
How could I improve my code ? Or perhaps go another way to tackle this problem?
Update after comment :
I have not solved the problem yet. But i tried the following. I assumed that when user change direction, a new event is trigger. So I could calculate the finger path. If user starts at M and finish in G without changing direction, then H has been hovered.

Character rotation (ActionScript 2.0)

I have some characters in my game on SmartFoxServer BASIC. Characters are controlled using the mouse (like in SFS basic avatarchat example)
I need characters can be rotated in different directions (like in different children MMO, for example Club Penguin).
My character is drawn with 8 sides (East, South-East, South, South-West, West, North-West, North, North-East).
How can I do it ? ActionScript 2.0
Maybe someone here have already made a similar on SFS? Or simply advise how this can be implemented ..
I know that it does not need to do anything on server-side.
(sorry for my english, I am not from an English-speaking country)
Note: I have not tested the following answer myself as I don't have testing environment currently:
Create a movieclip in your stage and insert the character sprites in individual frames of the layer sequentially.
Test to see if your character is rotating clockwise as expected starting from East.
Name the movieclip as "hero" for an instance.
Try the following code:
Actionscript 2:
_root.onEnterFrame = function() {
if (Key.isDown(Key.UP)) {
_root.hero.gotoAndStop(7);
if (Key.isDown(Key.LEFT)) {
_root.hero.prevFrame();
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.nextFrame();
}
} else if (Key.isDown(Key.DOWN)) {
_root.hero.gotoAndStop(3);
if (Key.isDown(Key.LEFT)) {
_root.hero.nextFrame();
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.prevFrame();
}
} else if (Key.isDown(Key.LEFT)) {
_root.hero.gotoAndStop(5);
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.gotoAndStop(1);
}
}