Yui Mouse Coordinates over Element - yui

I'm trying to determine if the mouse is over an element preferably with YUI if there is a method for that already.
Basically something like
function bool IsMouseOver(Element);

I ended up checking it myself.
I have the region from the target element
var region = YAHOO.util.Dom.getRegion(this.element);
var top = region.top;
var left = region.left;
var bottom = region.bottom;
var right = region.right;
Then the mouse coordinates
var mouseXY = YAHOO.util.Event.getXY(e);
var mX = mouseXY[0];
var mY = mouseXY[1];
And then a simple if statement to check if the mouse coordinates were in the region
(mX > left && mX < right && mY > top && mY < bottom)

Related

I tried to shoot an object towards cursor position, but it has a problem

I'm a beginner in Godot I want to shoot an object that is already in the game towards where the cursor's position is, and the method I created for it works fine but depending on the distance between the object and the cursor the speed changes. can anyone please help me make the speed constant?
I used this:
func _process(_delta):
if Input.is_action_just_released("tap"):
var mousepos = get_viewport().get_mouse_position()
var ballpos = self.get_position()
var x = mousepos.x - ballpos.x
var y = mousepos.y - ballpos.y
velocity = Vector2(x,y)
You can normalize your vector, which gives you a vector of unit length:
velocity = Vector2(x,y).normalize()
And then scale it by the speed you want:
velocity = Vector2(x,y).normalize() * speed
Where speed is a previously defined variable or constant. Something like this will do:
var speed := 100.0
You, of course, will want to tweak the value. So perhaps you want to export it so you can set it form the inspector:
export var speed := 100.0
By the way, you can rewrite the code you have to this:
var mousepos = get_viewport().get_mouse_position()
var ballpos = self.get_position()
velocity = mousepos - ballpos
Adding the changes suggested above we have:
var mousepos = get_viewport().get_mouse_position()
var ballpos = self.get_position()
velocity = (mousepos - ballpos).normalize() * speed
Which you can rewrite to this:
var mousepos = get_viewport().get_mouse_position()
var ballpos = self.get_position()
velocity = ballpos.direction_to(mousepos) * speed

Godot - Change tiles within an area

I'm trying to make it so if a function is called an area covered by a Collisionshape2D gets its tiles removed in a TileMap node. My problem is the area deleted doesn't match the Collisionshape2D's. Any insight is appreciated! Thank you.
My code:
func changeArea(collionshape):
var corridorTile = $CorridorTiles
var rect = Rect2(collionshape.position, collionshape.shape.extents*2)
var topleft = corridorTile.world_to_map(rect.position)
var bottomright = corridorTile.world_to_map(rect.end)
for x in range(topleft.x, bottomright.x):
for y in range(topleft.y, bottomright.y):
corridorTile.set_cell(x, y, -1)
Edit1*
Upon changing the code to:
func changeCorridorTile(collionshape):
var corridorTile = $CorridorTiles
var extents:Vector2 = collionshape.shape.extents
var topleft = corridorTile.world_to_map(collionshape.position - extents)
var bottomright = corridorTile.world_to_map(collionshape.position + extents)
for x in range(topleft.x, bottomright.x):
for y in range(topleft.y, bottomright.y):
corridorTile.set_cell(x, y, -1)
corridorTile.update_bitmask_region()
The cells in the tileMap which the collisionShape2D area covers get deleted. And I update them using .bitmask_region() method.
First thing I notice, from the top of my head: The Rect2 position is a corner, but the CollisionShape position is the center.
You would have to do it like this:
var extents:Vector2 = collionshape.shape.extents
var rect := Rect2(collionshape.position - extents, extents * 2)
Now, on a second look, you don't need the Rect2 at all:
var extents:Vector2 = collionshape.shape.extents
var topleft = corridorTile.world_to_map(collionshape.position - extents)
var bottomright = corridorTile.world_to_map(collionshape.position + extents)
One more thing: I believe that is in local space of the parent of the CollisionShape2D (an Area2D, I guess). So, if that is not working, it might be because you need to do it in global space. Hopefully you don't have any rotation (which would just mess the whole thing up) or scaling, so that would only be a matter of using global_position.
Addendum: I forgot something, world_to_map does not take global coordinates. Try this instead (assuming no rotation or scaling):
var extents:Vector2 = collionshape.shape.extents
var position := corridorTile.to_local(collionshape.global_position)
var topleft = corridorTile.world_to_map(position - extents)
var bottomright = corridorTile.world_to_map(position + extents)

(Godot Engine) Replicating Line2D's joint functionality on the first + last points

I have created the following method to outline an 2D polygon using an Line2D node (in favor of _drawing because of texturing and round jointing capabilities of the Line2D node):
func Set_Polygon_Outline(_polygon_node: Node2D, _width: int = 5, _color: Color = Color.black, _texture: Texture = null) -> void:
if _polygon_node is Polygon2D:
var _polygon: PoolVector2Array = (_polygon_node as Polygon2D).polygon
if _polygon.size() >= 3:
# Line2D node setup
var _line_node: Line2D = null
var _line_name: String = str(_polygon_node.name, "_Line")
if not _polygon_node.has_node(_line_name):
_line_node = Line2D.new() ; _line_node.name = _line_name ; _polygon_node.add_child(_line_node)
else: _line_node = _polygon_node.get_node(_line_name) as Line2D
# Line2D properties setup
if _line_node != null:
_line_node.width = _width ; _line_node.default_color = _color ; _line_node.joint_mode = Line2D.LINE_JOINT_ROUND
if _texture != null:
_line_node.texture = _texture ; _line_node.texture_mode = Line2D.LINE_TEXTURE_STRETCH
var _points: PoolVector2Array = _polygon ; _points.append(_polygon[0]) ; _line_node.points = _points
How would it be possible to replicate the round point jointing on point 0 in the same way as the other points?
The result meets expectations except on the closing points (from 4 to 0)
One approach I have tried is appending an additional point (point 1) to the _points Array. While the un-textured one looks as desired, the textured variant is slightly off on the additional line because of the two superimposing textures with alpha values making it look "bolder".
Another (very unorthodox approach) is creating two polygons: one black and one with an blur shader, using the following method:
func Set_Polygon_Shadow(_polygon_node: Node2D, _size: float = 10.0, _color: Color = Color.black) -> void:
if _polygon_node is Polygon2D:
var _polygon: PoolVector2Array = (_polygon_node as Polygon2D).polygon
if _polygon.size() >= 3:
# Shadow Polygon node setup
var _shadow_name: String = str(_polygon_node.name, "_Shadow")
if not _polygon_node.has_node(_shadow_name):
var _shadow_node: Polygon2D = Polygon2D.new()
_shadow_node.polygon = Geometry.offset_polygon_2d(_polygon, _size).front() ; _shadow_node.color = _color
_shadow_node.show_behind_parent = true ; _polygon_node.add_child(_shadow_node)
# Blur Polygon node setup
var _blur_node: Polygon2D = Polygon2D.new()
_blur_node.polygon = Geometry.offset_polygon_2d(_polygon, _size * 2.0).front()
_blur_node.material = ShaderMaterial.new()
_blur_node.material.shader = preload("res://shaders/Shader_Blur.shader")
_blur_node.material.set_shader_param("Strength", 2.0)
_blur_node.show_behind_parent = true ; _polygon_node.add_child(_blur_node)
The shader code:
shader_type canvas_item;
uniform float Strength : hint_range(0.0, 5.0);
void fragment() {COLOR = textureLod(SCREEN_TEXTURE, SCREEN_UV, Strength);}
The result looks good but I can't possibly imagine using this approach on a large number of polygons.
Thank you kindly,
Mike.
If using a Line2D is a viable solution, except for fixing the loop, then let us fix the loop.
For a Line2D to loop seamless, even with transparency, it must close in a straight segment (not a corner). And have no end caps.
Thus, I suggest to move the first point, half way between its original position and the second point. Then you add at the end the original position of the first point, following by a copy of its moved position...
Like this:
# Let o be a copy of the original first point
var o = _points[0]
# Let m be the middle of the straight segment between the first and second points
var m = o + (_points[1] - o) * 0.5
_points[0] = m # The line now starts in m, we are moving the first point forth
_points.append(o) # Since we moved the first point forth, add its original position back
_points.append(m) # Add m at the end, so it loops, in the middle of a straight segment
That should result in a Line2D that loops seamlessly.

Is there a way so that I can keep the square but resize it in openlayers?

I got four different coordinates that is making a square in the openlayers map. But I want to know if it is possible that instead of breaking the square shape, is it possible to just grab one of the corners and resize (make bigger/smaller) the square?
My coordinates are as follows:
var x_1 = 28.0244307;
var y_1 = -25.8635238;
var x_2 = 28.0244307;
var y_2 = -25.8835238;
var x_3 = 28.0444307;
var y_3 = -25.8835238;
var x_4 = 28.0444307;
var y_4 = -25.8635238;
And then the code to resize it, but it is breaking the square shape:
var coords = [
[x_1, y_1],
[x_2, y_2],
[x_3, y_3],
[x_4, y_4],
[x_1, y_1]
];
var polygon = new ol.geom.Polygon([coords]);
var feature = new ol.Feature(polygon);
polygon.transform('EPSG:4326', 'EPSG:3857');
var vectorSource = this.vectorSource;
vectorSource.addFeature(feature);
var select = new ol.interaction.Select();
var modify = new ol.interaction.Modify({
features: select.getFeatures(),
});
var snap = new ol.interaction.Snap({
source: vectorSource,
});
this.map.addInteraction(select);
this.map.addInteraction(modify);
this.map.addInteraction(snap);
Just create a polygon with your 4 points an use a GeometryFunction in your style to only display the points.
Then use ol-ext ol/interaction/Transform to modify the shape.

Raphael -- object rotation at arbitrary position

I'm using Raphael_2.01 and would like to rotate an object at arbitrary position.
(WindowsXP, Firefox3.6)
example: http://uproda11.2ch-library.com/326446b6u/11326446.png
This rectangle (rect0) rotates thirty degrees at its lower right point.
The parameters are:
var rectX = rect0.getBBox().x;
var rectY = rect0.getBBox().y;
var rectW = rect0.getBBox().width;
var rectH = rect0.getBBox().height;
var rot = 30;// rotation
var rotX, rotY;// arbitrary position
What code should I use ? I can't image suitable method.
thanks,
If I understand the question correctly, it's rect0.rotate(30, rotX, rotY);.

Resources