Posts

Showing posts from 2019

GroupChat: Chat and File Transfer

08:55  PM This is getting more and more fun!! After initially establishing a connection between two computers, and having every user view names of all other connected users, I thought of moving towards file transfer. In between that, I had to make quite a few rounds between two laptops to run the changes. But Kudos to @Govind for suggesting ssh! With ssh you can access any other computer in your network, via your own computer. So I only need to run some linux commands to copy the file in other computer and run it there. So, I first established da connection via UDP sockets between two different computers. Then, whenever a user wishes to transfer a file to another user, he just needs to click on the user name, and he gets a file picker box. After picking the file, the file begins to get transferred to the destination over a TCP reliable connection. The user also gets visual cue about the amount of file transferred and speed at which file transfer is happening.  ...

GroupChat Developments

12:05 PM So, I was able to achieve a successful communication between two computers connected over the same wifi network using python sockets. One of the problems that I encountered was that it kept dropping some packets which I sent for reasons I don't know. Still, long way to go.. Here is the code.. from socket import * import threading import json import sys def keep_recieving ( s ): while True : m = s.recvfrom( 54545 ) incoming_json = json.loads(m[ 0 ]) print ( ' \r ' ) if incoming_json[ 'type' ] == 'connect' : print (incoming_json[ 'name' ] + ' Joined' ) elif incoming_json[ 'type' ] == 'message' : if name == incoming_json[ 'from' ]: #print('You: '+incoming_json['message']) pass else : print (incoming_json[ 'f...

GroupChat : Ad hoc chat Application

3:45 PM Today I will try to revisit what I tried doing a few months ago. Creating a communication channel between two different mobile devices connected via hotspot/wifi. I am doing this with android studio and Java. I would first bind all the apps to a certain port number. Then I would ping the broadcast IP address to find out which applications are already bound to the above mentioned port. After that, I would try to send a message on the broadcast IP. Let's hope it works..

Littlehelp Upgradation

This is not a classic time oriented project post. There was a lot going on with family reasons, then the Midsems, and what not. Also most of my time (at least the time I didn't waste) went to developing Littlehelp. Littlehelp in it's current form ( http://littlehelp.epizy.com ) is just a pile of unorganized code jumbled together (as students of 1st year could have managed), and hosted on a platform that regularly suspends the website because of over usage of resources (Thanks to the huge load of traffic near Midsem and endsem). Also, it was written in PHP, so we didn't hade that dynamic nature of the website we so wanted. So since the past month, Me and my friend have been working to migrate the website to Heroku, and change the backent to NodeJS. This has been a cumbersome task, not only coding it from scratch, but also migrating the material from the previous website. Still, the work is pretty much complete, and I think the website will be live before the end semeste...

Bouncing Ball

4:45 PM I have been busy today, so didn't have any time for going further into the WebGL concepts. Thus, I just created a small representation of a bouncing ball, that shrinks when touching the ground and expands when bouncing back. It is just a matter of scaling it based on its y position.

Drawing a Sphere using WebGL

4:00 PM Going off the track for a little bit, I wanted to draw some real 3D shapes. So I started with a circle. Yes, I know, it's a 2D shape you will say. But to be able to draw a sphere, I should at least know how to draw a circle.  So I tried drawing it with the dividing polygon method. That is, first I drew only the 4 vertices at the ends of the principal axes. After that, I increased the segment count, by drawing another vertex between every two vertex. This new vertex point was calculated using sin and cosine, and multiplied by the radius. Applying this for increasing segment numbers, we get a very good approximation of a circle.  For the sphere, we need to have 2 angles, Lattitude and Longitude. Longitude are the horizontal lines of the sphere, and lattitude are the horizontal ones. computing x, y and z according to a known formula, here is what happens:

WebGL - Perspective

04:18 PM Yesterday, We created a 3D 'F', that we can rotate, scale and translate. But somewhat was amiss. The 'F' we created was 3D, but it did not have the perspective. All the sides of the F were of the same size, ndependent of how far it was. This representation of 3D is called as Orthographic.  But it is not how we percieve real world objects. In real world, we assume there is an eye at the center of the screen, and we percieve closer objects as larger and far off objects as smaller. This type of representation is called Perspective. Today, I implemented this 3D perspective projection into yesterday's code. Following is how it looks now, the controls are similar, (with added [ and ] keys for z translation ).

WebGL - Orthographic 3D

11:40 AM Yesterday, we have dived into the visual world of WebGL, and completed the initial setup, and drew a simple 2D "F" figure. Today, I tried creating some 3D magic using WebGL. It was quite similar to 2D. Just needed to add another dimension to the translation and scale matrix.  Rotation was a different thing. Since in 2D, we can have rotation about only one, namely Z-axis. But in 3D, rotations about 3 different axes are possible. Hence we need to create 3 different methods for rotation about X, Y and Z axes. WebGL draws shapes using primitive triangles. We provide it with vertexes of triangles, and it draws them. For example, if we want to draw a rectangle, we would provide it with 2 sets of 3 vertex. One set of 3 vertex draws one triangle, and another draws another. If we provide the vertex such that the triangles have a common hypotenous, we get a rectangle. For the 3D F, I needed 16 rectangles. Hence I needed to supply 16 * 6, 96 vertices. Following ...

WebGL Fundamentals

12:31 PM So, the long Diwali vacations are over and we are back to business. I left the journey at the verge of starting to learn WebGL. And god it was tiring. Today, I managed to create a simple figure, and apply some basic operations like translate, scale and rotate on the figure. So, to create a WebGL program, you need to do quite a lot of setup.  First you need to create a HTML Canvas element, since all of the magic that WebGL does happens inside this. Then you need to get the webgl context of this element. WebGL is basically a rasterization engine, that runs on 2 shaders, Vertex and Fragment.  The vertex shader tells the GPU the position of each vertex on the screen, and the fragment shader is used to determine the colour of each pixel. You need to create these 2 shader programs, which are written in GLSL, a shader language, which is written in a C/C++ type syntax.  Then you need to compile these shaders, and create a program and link those shaders wit...

Raycasting as a Torch + Light shading

2:00 PM Today, I improved upon yesterday's work. Yesterday, I created an object which raycasted uniformly in all directions, and only those rays were shown which hit something.  Today, I added a bit of movement and rotating functionality, as well as restricted the rays so that they form a cone. This is similar to having a torch and moving around. Also I drew the complete rays, even if they don't hit the wall, which created a kind of wall shadow illusion.  Below is the embedded project, you can move using arrow keys and rotate using mouse's X coordinate. Having completed this, I am now moving on and will try to display a sphere that is shaded by a directional light! 2:17 PM I need to back down a bit 😆. To create 3D graphics, I first need to learn OpenGL. I can ofcourse use the primitives defined by the P5 library itself, but it completely destroys the purpose of learning from scratch. So OpenGL it is! 10:45 PM So today was just a skim what is OpenGL ...

Raycasting

Image
3:00 PM I did something with bezier curves today, and achieved some kind of good looking grass. It was good, but I am thinking now of doing something right from the basics. So, I choose Raycasting.  Raycasting is nothing, just casting rays and computing intersections so to visualize the space. I am going to do a 2D version first, which consists of an object, which casts out light in a cone (torch) fashion, and the path lights up.  5:00 PM Raycasting was so much fun!! I was able to create a shadow like 2D effect, where the circle is a Raycaster, and casts ray in all direction, and displays the ray when it hits a boundary/wall.