How to create VAO and VBO to use with JOGL? - jogl

I read this stackoverflow answer. And tried to run the code given there. But all I get is a pink screen. I reached to a conclusion that the problem lies in the init() method. I have tried to understand how VAO-s and VBO-s work but I still don't get it. Most examples about JOGL either skip over the VAO, VBO part or the parts with VAO or VBO are super complex. Can someone tell me what I did wrong here?:
GL3 gl = drawable.getGL().getGL3();
gl.glEnableClientState(GL2.GL_VERTEX_ARRAY);
gl.glEnable(GL2.GL_DEPTH_TEST);
gl.glClearDepthf(10.0f);
gl.glClearColor(0.8f, 0.6f, 0.8f, 1.0f);
gl.glDepthFunc(GL2.GL_LEQUAL);
gl.glGenBuffers(2, buffers);
gl.glBindBuffer(GL2.GL_ARRAY_BUFFER, buffers.get(0));
gl.glBufferData(GL2.GL_ARRAY_BUFFER, 4 * 6 * 2, vertexFB, GL3.GL_STATIC_DRAW);
gl.glBindBuffer(GL2.GL_ARRAY_BUFFER, buffers.get(1));
gl.glBufferData(GL2.GL_ARRAY_BUFFER, 4 * 6 * 3, colorFB, GL2.GL_STREAM_DRAW);
gl.glGenVertexArrays(1, vertexArray);
gl.glBindVertexArray(vertexArray.get(0));
gl.glEnableVertexAttribArray(0);
gl.glBindBuffer(GL2.GL_ARRAY_BUFFER, buffers.get(0));
gl.glVertexAttribPointer(0, 2, GL.GL_FLOAT, false, 0, 0);
gl.glEnableVertexAttribArray(1);
gl.glBindBuffer(GL2.GL_ARRAY_BUFFER, buffers.get(1));
gl.glVertexAttribPointer(1, 3, GL.GL_FLOAT, false, 0, 0);
I think I'm somehow binding the VBO-s wrong or something.
https://codeshare.io/299wD0 Full code and shaders. Colors dont show up. It renders the rectangle, but its white. And i can comment out the shader part and i still get white rectangle. It seems like it is not using the shader.

Related

Determining what direction to face over a network with an omnidirectional camera

I have a rather difficult problem. I am making a topdown 2D game. And I have decided to make an omnidirectional character control like realm of the mad god (Video shows at second 16 what that means). I have it all working fine and have managed to work out almost all the kinks of this sort of camera but one thing remains.
(if you dont know what effect im looking create you can see and example hee at 16 seconds mark: https://youtu.be/N2q6aXkvIiI?t=12s)
When the Camera of the the main client gets rotated more that 180 degrees Left becomes right and right becomes left and my messages to the server about flipping the given character when he is supposed to get inverted. I somewhat fixed this by making an if statement that sends an opposite flip request when your world is completely flipped.
However up and down also become a factor as they dont send requests to flip the character.
What im trying to get to is that I have overcomplicted this script I beleive when trying to get the correct messages accross all clients.
I am wondering if anyone has a logical solution to making sure all chracters on the network are always facing the correct direction at all times.
I am using socket.io and Node.js for speaking to the server.
Any input would be appeciated.
TL;DR
How would you go about making realm of the mad gods camera rotation style when all clients need to know what way everyone is facing. (see video 0:16)
thanks.
I have somewhat fixed this problem with a bit of a rewrite of my logic and managed to make all the magic happen on the client and keep the server out of it entirely. I do not know if what I have done is super effecient as I am rather new to coding.
The logic is that I have created a circle collider2D that represents the players field of view. so things slightly outside the camera view are included. Any collision with an object tagged "otherPlayer" will add them to a list.
I then iterate through the list, if its not empty, and I determine if the object is moving away or coming towards me. (thank you to HigherScriptingAuthority for part of the code for this :: https://forum.unity3d.com/threads/left-right-test-function.31420/).
once I know that, all I have to do is grab the transform of that object and flip it accordingly. Boom it now rotates the object or player correctly no matter what rotation the main client is in.
Hope this makes sense and it helps someone:
private float lastDist = 0;
public float dirNum;
void CheckArea()
{
if (listOfPlayers.Count != 0)
{
foreach(var otherPlayer in listOfPlayers)
{
float distance = (transform.position - otherPlayer.transform.position).magnitude;
if (distance < lastDist)
{
Vector3 heading = otherPlayer.transform.position - transform.position;
dirNum = AngleDir(transform.forward, heading, transform.up);
var objectDirection = AngleDir(transform.forward, heading, transform.up);
if (objectDirection > 0)
{
var nav = otherPlayer.GetComponent<Navigator>();
nav.Left();
}
if (objectDirection < 0)
{
var nav = otherPlayer.GetComponent<Navigator>();
nav.Right();
}
}
if (distance > lastDist)
{
Vector3 heading = otherPlayer.transform.position - transform.position;
dirNum = AngleDir(transform.forward, heading, transform.up);
var objectDirection = AngleDir(transform.forward, heading, transform.up);
if (objectDirection > 0)
{
var nav = otherPlayer.GetComponent<Navigator>();
nav.Right();
}
if (objectDirection < 0)
{
var nav = otherPlayer.GetComponent<Navigator>();
nav.Left();
}
}
lastDist = distance;
}
}
}

How to make a very large skybox? (babylon.js)

How can I make a very large skybox?
Example:
var skybox = BABYLON.Mesh.CreateBox("skyBox", 15000.0, this.scene);
The result is bad:
The first thing I suggest is to reduce the scale factor of your spaceship and planet models. It seems that having a SkyBox size larger than 10000 causes the ugly texture seams/tearing of the Skybox at particular camera angles and distances. So bring everything down in scale if possible to make more room inside the limits of the Skybox perimeter.
Next try this: set .infiniteDistance = true to keep the Skybox away from the camera, and also set .renderingGroupId = 0 on the Skybox. Lastly, set .renderingGroupId = 1 or more, on all the models and objects to help stop them from disappearing into thin air.
var skybox = BABYLON.MeshBuilder.CreateBox("skyBox", {size:10000.0},
this.scene);
skybox.infiniteDistance = true;
skybox.renderingGroupId = 0;
...and for models and sprite objects...
myModel.renderingGroupId = 1; /* greater than 0 */
These little tricks helped me to achieve a to-scale solar system simulation, but may not work in all cases.
Hello you need to increase camera.maxZ to a value larger than your skybox.

Gtk3 keys bindings in css files

Where can I find an exhaustive list of available keybindings that a user can define in a CSS file for GTK+ 3?
I have already checked those resources:
https://developer.gnome.org/gtk3/stable/GtkCssProvider.html
https://developer.gnome.org/gtk3/stable/gtk3-Bindings.html
/usr/share/themes/Default/gtk-3.0/gtk-keys.css (which is empty)
/usr/share/themes/Emacs/gtk-3.0/gtk-keys.css
For example, how can a user make <Control>Space move the cursor to the end of the text in a GtkTextView?
It seems that there is no exhaustive documentation. Here is what I have found so far:
The list of the possible actions (from /usr/share/themes/Emacs/gtk-3.0/gtk-keys.css) :
move-cursor
delete-from-cursor
cut-clipboard
past-clipboard
start-interactive-search
move-current
Get the gtk+ code :
git clone git://git.gnome.org/gtk+
For example, the "move-cursor action":
bind "<ctrl>b" { "move-cursor" (logical-positions, -1, 0) };
If you do a :
grep -i logical gtk+/gtk/gtkenums.h
You will find a match and see that there are others possibilities :
/**
* GtkMovementStep:
* #GTK_MOVEMENT_LOGICAL_POSITIONS: Move forward or back by graphemes
* #GTK_MOVEMENT_VISUAL_POSITIONS: Move left or right by graphemes
* #GTK_MOVEMENT_WORDS: Move forward or back by words
* #GTK_MOVEMENT_DISPLAY_LINES: Move up or down lines (wrapped lines)
* #GTK_MOVEMENT_DISPLAY_LINE_ENDS: Move to either end of a line
* #GTK_MOVEMENT_PARAGRAPHS: Move up or down paragraphs (newline-ended lines)
* #GTK_MOVEMENT_PARAGRAPH_ENDS: Move to either end of a paragraph
* #GTK_MOVEMENT_PAGES: Move by pages
* #GTK_MOVEMENT_BUFFER_ENDS: Move to ends of the buffer
* #GTK_MOVEMENT_HORIZONTAL_PAGES: Move horizontally by pages
*/
For example the binding I wanted to do (move the cursor to the end of the text in a Gtk::TextView)
bind "<Control>KP_Space" { "move-cursor" (buffer-ends, 1, 0) }
The "template" is :
bind "key_combination" { "action" (action_param1, action_param2, ...)}
For the move-cursor action, the parameters are (step, count, extend_selection), where step is one of the above enum values. To note that for line-ends, paragraph-ends and buffer-ends a negative count means "beginning" and a positive value means "end". And extend_selection is simply 0 or 1 (for C-style "False" and "True").
In the same way, the options for the action "delete-from-cursor" are :
/**
* GtkDeleteType:
* #GTK_DELETE_CHARS: Delete characters.
* #GTK_DELETE_WORD_ENDS: Delete only the portion of the word to the
* left/right of cursor if we’re in the middle of a word.
* #GTK_DELETE_WORDS: Delete words.
* #GTK_DELETE_DISPLAY_LINES: Delete display-lines. Display-lines
* refers to the visible lines, with respect to to the current line
* breaks. As opposed to paragraphs, which are defined by line
* breaks in the input.
* #GTK_DELETE_DISPLAY_LINE_ENDS: Delete only the portion of the
* display-line to the left/right of cursor.
* #GTK_DELETE_PARAGRAPH_ENDS: Delete to the end of the
* paragraph. Like C-k in Emacs (or its reverse).
* #GTK_DELETE_PARAGRAPHS: Delete entire line. Like C-k in pico.
* #GTK_DELETE_WHITESPACE: Delete only whitespace. Like M-\ in Emacs.
*
* See also: #GtkEntry::delete-from-cursor.
*/
Now if you want all to see all the possible actions that are hard coded, then
here is a way :
find ./gtk+/ -type f | xargs grep -A 2 gtk_binding_entry_add_signal
You will see lot of things like this :
./gtk+/gtk/gtklabel.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_backslash, GDK_CONTROL_MASK,
./gtk+/gtk/gtklabel.c- "move-cursor", 3,
./gtk+/gtk/gtklabel.c- G_TYPE_ENUM, GTK_MOVEMENT_PARAGRAPH_ENDS,
--
./gtk+/gtk/gtklabel.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_c, GDK_CONTROL_MASK,
./gtk+/gtk/gtklabel.c- "copy-clipboard", 0);
./gtk+/gtk/gtklabel.c-
./gtk+/gtk/gtklabel.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_Return, 0,
./gtk+/gtk/gtklabel.c- "activate-current-link", 0);
./gtk+/gtk/gtklabel.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_ISO_Enter, 0,
./gtk+/gtk/gtklabel.c- "activate-current-link", 0);
./gtk+/gtk/gtklabel.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_KP_Enter, 0,
./gtk+/gtk/gtklabel.c- "activate-current-link", 0);
./gtk+/gtk/gtklabel.c-
--
./gtk+/gtk/gtkdialog.c: gtk_binding_entry_add_signal (binding_set, GDK_KEY_Escape, 0, "close", 0);
Then it should be easy to find what you were looking for.
My guess is you should find any signal with the G_SIGNAL_ACTION flag enabled. You could get this list programmatically from the Gtk gir file (/usr/share/gir-1.0/Gtk-3.0.gir on my system) by looking for every <glib:signal> entity with the action attribute set to 1.
I am not so fond on XPath to come out with a one-line solution though.
I've also been looking for proper documentation of possible key bindings for quite a while now and just stumbled over these docs of the single-line text widget GtkEntry. In this particular case, one can scroll all the way down to the end of the menu to find all other "keybinding signals" the widget offers, like insert_at_cursor, paste_clipboard etc. including the parameters these signals accept (such as the DeleteType in case of delete_from_cursor). It now shouldn't be too hard to find the signals for other GTK widgets.
Update: If the Vala docs provide a detailed description of the keybinding signals, one might assume that the regular Gtk3 docs do, too. Indeed. It's always easier to find what you're looking for if you know what you're looking for. :)
I think ultimately ntd has the most correct idea, but here is a more browsable solution, rather than grepping through the GIR file.
You should (assuming comprehensive documentation) be able to find this info by going to the documentation page for the widget of interest, then search that page for the term keybinding signal.
The available signals are documented along with the others on each widget's page and then qualified as whether or not they are for key bindings in the description.
Usually you can also identify them by the fact that their value in the 2nd column of the summary table of signals, i.e. signal type flags, is Action, as also pointed out by ntd.
For example, GtkComboBox:move-active:
[handler function signature]
The ::move-active signal is a keybinding signal which gets emitted to move the active selection.
[description of arguments]
As ntd indicated, this can probably be automated to a large extent. Like the GIR, the documentation is generated from the C source files, so if you lack a GIR file or just prefer this way, you can presumably do some clever use of grep, sed, et al. through those to pull out the info.
#ntd suggested looking at /usr/share/gir-1.0/Gtk-3.0.gir for
<glib:signal action="1"> entities. I don't have a Gtk-3.0.gir but I do have a Gtk-2.0.gir and these are the unique results I found using that approach:
cat /usr/share/gir-1.0/Gtk-2.0.gir \
| sed -n '/.*<glib:signal name="\([^"]*\)".* action="1".*/s//\1/p' \
| sort -u
abort-column-resize
accept-position
activate
activate-current
activate-cursor-item
activate-default
activate-focus
backspace
cancel
cancel-position
change-current-page
change-focus-row-expansion
change-value
clicked
close
composited-changed
copy-clipboard
cut-clipboard
cycle-focus
delete-from-cursor
end-selection
expand-collapse-cursor-row
extend-selection
focus-home-or-end
focus-tab
grab-focus
insert-at-cursor
kill-char
kill-line
kill-word
move
move-active
move-current
move-cursor
move-focus
move-focus-out
move-handle
move-page
move-scroll
move-slider
move-to-column
move-to-row
move-viewport
move-word
page-horizontally
paste-clipboard
popdown
popup
popup-menu
reorder-tab
row-activated
scroll-child
scroll-horizontal
scroll-vertical
select-all
select-cursor-item
select-cursor-parent
select-cursor-row
select-page
set-anchor
set-editable
set-scroll-adjustments
show-help
start-interactive-search
start-selection
toggle-add-mode
toggle-cursor-item
toggle-cursor-row
toggle-cursor-visible
toggle-focus-row
toggle-overwrite
undo-selection
unselect-all

2D Game colision response

So I am writing a game, but I have come to the part where i need to do some collision response, and I have been stumped. I have an algorithm that finds the objects collision angle, and collision depth meaning how much the two objects over lap. I understand what i want to do and that is to find a perpendicular vector to the collision angle and push back the object that is colliding by it's collision depth, but I just can't seem to write it correctly.
Here is the code I'm working with for the time being.
var collision:Object = collisions[i];
var angle:Number = collision.angle;
var overlap:Number = collision.overlapping.length;
trace(overlap);
trace(angle);
var moveX = Math.cos(angle) * overlap;
var moveY = Math.sin(angle) * overlap;
obj2.x -= moveX;
obj2.y += moveY;
basically I just want the object that is colliding with the wall to stop when it hits it.
any help would be greatly appreciated.
I worked on elastic collision with flash as3 once.I tried to fix overlap a lot of.But i could'nt solved it completely.They did not overlapping normally but if you forced enought, they overlapping.
if you want look at my work, i uploaded my codes.You can download and look at my code.
And if you solve this problem completely, please tell me solution.
swf(with friction, it's more problem) : http://nafiz.in/collision/carpisma.swf
swf(without friction, it's little problem than first.) : http://nafiz.in/collision/carpisma_surtunmesiz.swf
q : add a ball at mouse location.
w, a,s,d : controll #1 ball.
Click with mouse without relase and move mouse and relase. You selected balls.
When you press space, selected balls will go mouse location.
Cods : http://nafiz.in/collision/collision.rar
i hope you solve.
So after a few hours of tweaking the code, I came up with the solution that works well. here is my new code:
public function Colisions(obj1,obj2) {
var collisions:Array=MyCollision.checkCollisions();
for (var i = 0; i < collisions.length; i++) {
var collision:Object=collisions[i];
var angle:Number=collision.angle;
var overlap:Number=collision.overlapping.length;
// finds the amount in x and y coordinates to move the ball back, and it devides overlap by 20 so that the ball does not jump as much.
var moveX=Math.cos(angle)*(overlap/20);
var moveY=Math.sin(angle)*(overlap/20);
// sets the ball to it's original location before the colision.
obj2.x=obj2.x-moveX;
obj2.y=obj2.y-moveY;
}
}
just as a side note I am using CDK which stands for the collision detection toolkit as the algorithm that finds the collisions and the info associated with the collisions.

Qt: Using QTransform object for rotate differs from setting setRotation() in QGraphicsItem

While setting a QGraphicsItem rotation, I get different results upon the transformation origin point while using setRotation() and using:
transform = QTransform()
transform.rotate(myAngle)
myItem.setTransform(transform)
In both portion of code, I set setTransformOriginPoint() to the same point.
Results are:
While using setRotation() method, the item is rotated upon its transformation origin point.
While using the QTransform object, the item is rotated upon item's origin, that is, point (0,0).
My code is more complex than that, but I think It applies the same. The QGraphicsItem is in fact a QGraphicsItemGroup and I can check the issue adding just one item, and in my rotation procedure change the setRotation() method for the QTransform object. The latter, ignores the setTransformOriginPoint().
I'm having this issue for a while, and I dig a lot of resources. I browse the Qt C++ code, and I can see that the setRotation() method modifies a field calles rotation (a real value) in the TransformData structure within the QGraphicsItem. The origin point is also a two field real value in such a structure called xOrigin and yOrigin respectively. The transformation is stored in the tranform field. All this information is used in a variable called: transformData.
So, I don't get why the transformation set in the transformData->transform field is ignoring the values transformData->xOrigin and transformData->yOrigin at the time of being applied.
The code I used to test that issue is the following relevant part (I have an rotate item that receives mouse inputs and applies rotation to the item itself):
# This method using QTransform object....
def mouseMoveEvent(self, event):
if self.pressed:
parent = self.parentItem()
parentPos = parent.boundingRect().center()
newPoint = event.scenePos()
iNumber = (newPoint.x()-parentPos.x())-((newPoint.y()-parentPos.y()))*1j
angle = cmath.phase(iNumber)+1.5*math.pi
self.appliedRotation = (360-math.degrees(angle))%360 - self.angleOffset
transform = QTransform()
transform.rotate(self.appliedRotation)
self.parentItem().setTransform(transform)
# ...Against this one using setRotation()
def mouseMoveEvent(self, event):
if self.pressed:
parent = self.parentItem()
parentPos = parent.boundingRect().center()
newPoint = event.scenePos()
iNumber = (newPoint.x()-parentPos.x())-((newPoint.y()-parentPos.y()))*1j
angle = cmath.phase(iNumber)+1.5*math.pi
self.appliedRotation = (360-math.degrees(angle))%360 - self.angleOffset
self.parentItem().setRotation(self.appliedRotation)
On both, previously the setTransformOriginPoint() is set, but it's not a relevant part to show the code, but just to know that it is done.
I'm getting frustrated to not find a solution to it. As it seems so straightforward, why setting a rotation transformation matrix does not use the transformation origin point that I have set and while using setRotation() method works fine? That question took me to the source code, but now is more confusing as rotation is keeping separated from the transformation applied...
I was solving the same problem. I found out that QGraphicsItem::setTransformOriginPoint() is accepted only for QGraphicsItem::setRotation(). It is ignored for QGraphicsItem::setTransform().
I use this code to reach the same behavior for QTransform():
transform = QtGui.QTransform()
centerX = item.boundingRect().width()/2
centerY = item.boundingRect().height()/2
transform.translate( centerX , centerY )
transform.rotate( -rotation )
transform.translate( -centerX , -centerY )
item.setTransform( transform )

Resources